Plugin related and other generic customizations 2
This is Page 2 of Plugin related and other generic customizations in Builder. Here is Page 1.
1. Edit your child theme's functions.php.
Add the following at the end (before closing PHP tag, if present):
add_filter('wp_nav_menu_main-menu_items','add_images', 10, 2); function add_images($items, $args) { $items .= '<div class="socialmedia-buttons"><li><a target="_blank" rel="nofollow" href="http://www.facebook.com/"><img class="fade" style="opacity: 0.8; -moz-opacity: 0.8;" title="Follow Us on Facebook" alt="Follow Us on Facebook" src="//ithemes.com//builder/misc/social-media-icons/32/facebook.png"></a></li>'; $items .= '<li><a target="_blank" rel="nofollow" href="http://twitter.com/#!/"><img class="fade" style="opacity: 0.8; -moz-opacity: 0.8;" title="Follow Us on Twitter" alt="Follow Us on Twitter" src="//ithemes.com//builder/misc/social-media-icons/32/twitter.png"></a></li>'; $items .= '<li><a target="_blank" rel="nofollow" href="http://www.yoursite.com/feed/"><img class="fade" style="opacity: 0.8; -moz-opacity: 0.8;" title="Follow Us on RSS" alt="Follow Us on RSS" src="//ithemes.com//builder/misc/social-media-icons/32/rss.png"></a></li>'; $items .= '<li class="last"><a target="_blank" rel="nofollow" href="mailto: [email protected]"><img class="fade" style="opacity: 0.8; -moz-opacity: 0.8;" title="E-mail Us" alt="E-mail Us" src="//ithemes.com//builder/misc/social-media-icons/32/email.png"></a></li></div>'; return $items; }
Note: In the above code, main-menu must be replaced with the slug of your custom menu. Ex.: If the name of your custom menu is Primary Navigation, then
add_filter('wp_nav_menu_main-menu_items','add_images', 10, 2);
must be changed to
add_filter('wp_nav_menu_primary-navigation_items','add_images', 10, 2);
2. Add the following at the end of child theme's style.css and customize it if necessary:
/* Custom Styles For The Social Media Widget Icons in Navigation */ .socialmedia-buttons { float: right; } .socialmedia-buttons img { border: 0; border: 0 !important; margin-right: 10px !important; display: inline; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease; } .socialmedia-buttons a { background: none !important; padding: 12px 0 0 5px !important; border-right: none !important; } .socialmedia-buttons a:hover { text-decoration: none; border: 0; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; } .socialmedia-buttons img.fade:hover { opacity: 1 !important; -moz-opacity: 1 !important; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease; }
Here is sample customized code for a few child themes: Default, Americana Interstate, Ionic.
How to display Posts from a specific category on a Page in Magazine Extension style
The instructions below outline how to have all posts from a category named Issues (ID = 18) appear on a Page titled Issues List (slug = issues-list).
1. Ensure that pretty permalinks are enabled. Create a Page titled Issues. Do not enter any content in the Page. Just enter the title and publish.
2. Save this code as page-issues-list.php. (i.e., page-<<slug>>.php)
- Set a title for this Page in line 12.
- Edit the category ID in line 21.
Upload this file to child theme directory.
3. Copy lib directory from parent Builder/extensions/magazine directory into child theme directory.
4. Add this at the end of child theme's style.css.
That's it.
Note: If a layout is applied to this Page, ensure that it (the layout) does not have an extension applied.