Below, you’ll find a detailed guide on how to add the ShiftNav – Responsive Mobile Menu Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the ShiftNav – Responsive Mobile Menu Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the ShiftNav – Responsive Mobile Menu Plugin and the shortcodes it provides:
"ShiftNav – Responsive Mobile Menu is a WordPress plugin that enhances your website's navigation experience. It creates an intuitive, mobile-friendly menu, making your site more accessible and user-friendly."
- [shiftnav_toggle]
- [shift_bloginfo]
- [shift_toggle_title]
ShiftNav [shiftnav_toggle] Shortcode
The Shiftnav Toggle shortcode is a functional piece of code that allows the creation of a responsive navigation menu. It extracts attributes like target, toggle_id, etc., and uses them to generate a toggle for the Shiftnav menu. If ‘disable_content’ is set to ‘true’, no content will be displayed. It also supports ARIA labels for accessibility.
Shortcode: [shiftnav_toggle]
Parameters
Here is a list of all possible shiftnav_toggle shortcode parameters and attributes:
target– Identifies which menu to toggletoggle_id– Specifies an ID for the toggle elementel– Sets the HTML element for the toggleclass– Assigns a CSS class to the toggleicon– Defines an icon for the toggle buttondisable_content– Controls whether content is displayedaria_label– Provides label for accessibility purposes
Examples and Usage
Basic example – A simple usage of the shortcode to toggle the main ShiftNav menu.
[shiftnav_toggle target="shiftnav-main" /]Advanced examples
Using the shortcode to toggle a specific ShiftNav menu by its ID, while also specifying the HTML element to use for the toggle, and adding a custom CSS class.
[shiftnav_toggle target="shiftnav-custom" el="button" class="my-custom-toggle" /]Using the shortcode to toggle a ShiftNav menu with a specific icon, while disabling the toggle content and adding a custom aria-label for accessibility.
[shiftnav_toggle target="shiftnav-main" icon="fa-bars" disable_content="true" aria_label="Toggle Navigation" /]Using the shortcode to toggle a ShiftNav menu with a specific icon and ID, while adding a custom CSS class and aria-label for accessibility.
[shiftnav_toggle target="shiftnav-main" toggle_id="my-toggle" icon="fa-bars" class="my-custom-toggle" aria_label="Toggle Navigation" /]PHP Function Code
In case you have difficulties debugging what causing issues with [shiftnav_toggle] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( 'shiftnav_toggle' , 'shiftnav_toggle_shortcode' );Shortcode PHP function:
function shiftnav_toggle_shortcode( $atts, $content ){
extract( shortcode_atts( array(
'target' => 'shiftnav-main',
'toggle_id' => '',
'el' => 'a',
'class' => '',
'icon' => '',
'disable_content' => '',
'aria_label' => false,
), $atts, 'shiftnav_toggle' ) );
if( $disable_content == 'true' ) $content = false;
ob_start();
shiftnav_toggle( $target , $content , array( 'id' => $toggle_id , 'el' => $el , 'class' => $class , 'icon' => $icon, 'aria_label' => $aria_label ) );
$toggle = ob_get_contents();
ob_end_clean();
return $toggle;
}
Code file location:
shiftnav-responsive-mobile-menu/shiftnav-responsive-mobile-menu/includes/functions.phpShiftNav – Responsive Mobile Menu [shift_bloginfo] Shortcode
The ‘ShiftNav Bloginfo’ shortcode is a tool to extract specific blog information. By using the shortcode: [shift_bloginfo], you can retrieve and display details like blog name, description, admin email, etc., based on the ‘key’ attribute you provide.
Shortcode: [shift_bloginfo]
Parameters
Here is a list of all possible null shortcode parameters and attributes:
key– Defines specific blog information to return
Examples and Usage
Basic example – The following example demonstrates how to use the ‘shift_bloginfo’ shortcode to retrieve the name of the blog.
[shift_bloginfo key="name" /]Advanced examples
You can also use the ‘shift_bloginfo’ shortcode to retrieve the blog’s description or tagline. Here’s an example:
[shift_bloginfo key="description" /]Another advanced usage of the shortcode can be to retrieve the site’s URL. This can be particularly useful if you want to create a hyperlink to the site within your content. Here’s how you can do it:
[shift_bloginfo key="url" /]Finally, you can use the shortcode to fetch the admin email address of the blog. This can be useful if you want to display the admin email address within your content. Here’s an example:
[shift_bloginfo key="admin_email" /]PHP Function Code
In case you have difficulties debugging what causing issues with [null] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('shift_bloginfo', 'shiftnav_bloginfo_shortcode');Shortcode PHP function:
function shiftnav_bloginfo_shortcode( $atts ) {
extract(shortcode_atts(array(
'key' => '',
), $atts));
return get_bloginfo($key);
}
Code file location:
shiftnav-responsive-mobile-menu/shiftnav-responsive-mobile-menu/includes/functions.phpShiftNav – Responsive Mobile Menu [shift_toggle_title] Shortcode
The ShiftNav Responsive Mobile Menu shortcode is a function that generates a clickable link to your homepage using your blog’s title as the anchor text. The shortcode, ‘shift_toggle_title’, when added to your WordPress page, will display your blog’s title as a hyperlink, redirecting users to your homepage.
Shortcode: [shift_toggle_title]
Examples and Usage
Basic example – The following shortcode will display the title of your blog and link it to the home page of your website.
[shift_toggle_title /]Advanced examples
Although the default shortcode doesn’t accept parameters, we can modify the PHP function to accept parameters. For example, we can modify it to accept a URL and a title, and return a link to the URL with the provided title.
function shiftnav_default_toggle_content( $atts ) {
$atts = shortcode_atts( array(
'url' => get_home_url(),
'title' => get_bloginfo( 'title' ),
), $atts, 'shift_toggle_title' );
return ''.$atts['title'].'';
}
add_shortcode('shift_toggle_title', 'shiftnav_default_toggle_content');
With this modification, you can use the shortcode like this:
[shift_toggle_title url="http://example.com" title="Example Title" /]This will display a link that says “Example Title” and links to “http://example.com”.
PHP Function Code
In case you have difficulties debugging what causing issues with [shift_toggle_title] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('shift_toggle_title', 'shiftnav_default_toggle_content');Shortcode PHP function:
function shiftnav_default_toggle_content( $atts ) {
return '<a href="'.get_home_url().'">'.get_bloginfo( 'title' ).'</a>';
}
Code file location:
shiftnav-responsive-mobile-menu/shiftnav-responsive-mobile-menu/includes/functions.phpConclusion
Now that you’ve learned how to embed the ShiftNav – Responsive Mobile Menu Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply