self::starter(), 'panelsUrl' => admin_url( 'themes.php?page=softicon-mega-menu' ), ) ) . ';'; wp_add_inline_script( generate_block_asset_handle( 'softicon/mega-menu', 'editorScript' ), $data, 'before' ); } // three columns of links, so a new panel shows something to edit public static function starter() { $columns = array( array( __( 'Shop', 'softicon-mega-menu' ), __( 'New arrivals', 'softicon-mega-menu' ), __( 'Best sellers', 'softicon-mega-menu' ), __( 'Sale', 'softicon-mega-menu' ) ), array( __( 'Company', 'softicon-mega-menu' ), __( 'About us', 'softicon-mega-menu' ), __( 'Careers', 'softicon-mega-menu' ), __( 'Contact', 'softicon-mega-menu' ) ), array( __( 'Help', 'softicon-mega-menu' ), __( 'Shipping', 'softicon-mega-menu' ), __( 'Returns', 'softicon-mega-menu' ), __( 'FAQ', 'softicon-mega-menu' ) ), ); $html = ''; foreach ( $columns as $column ) { $html .= "\n
\n

" . esc_html( array_shift( $column ) ) . "

\n"; foreach ( $column as $link ) { $html .= "\n\n\n

" . esc_html( $link ) . "

\n"; } $html .= "
\n\n\n"; } return "\n
" . rtrim( $html ) . "
\n"; } // the Site Editor opened on one template part, id is "theme//slug" public static function edit_url( $id ) { return add_query_arg( array( 'postType' => 'wp_template_part', 'postId' => rawurlencode( $id ), 'canvas' => 'edit', ), admin_url( 'site-editor.php' ) ); } // a "Mega Menu" area in the Site Editor for the panels; the same "menu" area other mega menu plugins use is kept, not added twice public function area( $areas ) { foreach ( (array) $areas as $area ) { if ( isset( $area['area'] ) && 'menu' === $area['area'] ) { return $areas; } } $areas[] = array( 'area' => 'menu', 'area_tag' => 'div', 'label' => __( 'Mega Menu', 'softicon-mega-menu' ), 'description' => __( 'Panels that open from a Mega Menu item in the Navigation block.', 'softicon-mega-menu' ), 'icon' => 'layout', ); return $areas; } // the template part's blocks, or '' when it is missing or already being rendered public static function panel( $slug ) { $slug = sanitize_title( $slug ); if ( ! $slug || isset( self::$rendering[ $slug ] ) ) { return ''; } self::$rendering[ $slug ] = true; ob_start(); block_template_part( $slug ); $html = ob_get_clean(); unset( self::$rendering[ $slug ] ); return trim( $html ); } // hex, rgb(a), hsl(a) or a preset var(), anything else is dropped public static function color( $value ) { $value = is_string( $value ) ? trim( $value ) : ''; if ( preg_match( '/^(#[0-9a-f]{3,8}|(rgb|hsl)a?\([0-9.,%\s\/]+\)|var\(--[a-z0-9-]+\))$/i', $value ) ) { return $value; } return ''; } private static function choice( $attributes, $key, $choices ) { return isset( $attributes[ $key ] ) && in_array( $attributes[ $key ], $choices, true ) ? $attributes[ $key ] : $choices[0]; } // settings read by view.js public static function config( $attributes ) { $url = ! empty( $attributes['url'] ); $config = array( 'openOn' => self::choice( $attributes, 'openOn', array( 'hover', 'click' ) ), 'width' => self::choice( $attributes, 'width', array( 'wide', 'content', 'full', 'custom' ) ), 'align' => self::choice( $attributes, 'panelAlign', array( 'center', 'left', 'right' ) ), // "go to the link" on phones needs a link 'mobile' => $url ? self::choice( $attributes, 'mobile', array( 'accordion', 'link' ) ) : 'accordion', ); return apply_filters( 'almm_config', $config, $attributes ); } // the panel's size and colors as css variables on the menu item public static function style( $attributes, $config ) { $widths = array( 'content' => 'var(--wp--style--global--content-size, 800px)', 'wide' => 'var(--wp--style--global--wide-size, 1200px)', 'full' => '100vw', 'custom' => min( 2400, max( 200, absint( $attributes['customWidth'] ?? 800 ) ) ) . 'px', ); $vars = array( '--almm-width' => $widths[ $config['width'] ], '--almm-gap' => min( 100, absint( $attributes['gap'] ?? 0 ) ) . 'px', '--almm-pad' => min( 100, absint( $attributes['padding'] ?? 24 ) ) . 'px', '--almm-radius' => 'full' === $config['width'] ? '0px' : min( 60, absint( $attributes['radius'] ?? 8 ) ) . 'px', '--almm-bg' => self::color( $attributes['panelBg'] ?? '' ), '--almm-color' => self::color( $attributes['panelColor'] ?? '' ), ); $style = ''; foreach ( $vars as $name => $value ) { if ( '' !== $value ) { $style .= $name . ':' . $value . ';'; } } return $style; } }