HOW THE MENU SLIDER WORKS ON FUSION HOMEPAGE

(Carousel Horizontal Posts Slider and plugins for hiding certain categories in "Category" and "Archive" Widgets that might populate your sidebar.)

  1. Create a new post category (I called it "menu slider"). (Carousel plug in, free version only allows you to grab info from posts, not pages.) Set the publish date to be far in the past so it won't show up in Recent Posts in sidebar (we never actually wan to view this post).
  2. Create a new post with a featured image you want to use as an image in the slider. Set the post category to the new category you created in step 1 above.
  3. Install and configure Carousel Horizontal Posts Slider so it displays only the carousel. (see plug in details and/or readme file in plugin directory. Also see plugin settings in the WP admin to set the category to display to the category you created above the provided dropdown. Remove post title and read more display from the plug in admin too.) Put the shortcode or template call in the page/template you want the slider to display on.
  4. Since the Carousel plugin puts in a link to the POST (and we don't want visitors going to that post) while we want to link to a different PAGE we trick the plugin by a) setting the link on the image to not show with this CSS "span .chpcs_img a img{position: realtive; z-index: -50000;}" and b) by modifiying the plug in so it won't clean out the html anchor tags we'll be putting into the excerpt in the next step. Find this line in the plugin file and comment it out as shown: //$string = strip_shortcodes(wp_trim_words( $string, (int)$substr )); Then, to prevent the plugin from updating and overwriting this, set the version number from "3..." to "300..."" (at very top of document) like so: Version: 300.2.5
  5. Go back to the post you created in step 1, and in the excerpt field put the link text and actual anchor tag of the page you want the words beneath the image to link to (unforutnaley we can't link the image, but this is actually better for swiping mobile devices anyway).
  6. Use "AVH Extended Categories Widgets" plugin to remove your new post category from appearing in the "Categories" widget you might have displaying in the sidebar.
  7. Use "jQuery Archive List Widget" plugin to remove the post category from appearing in the "Archives" widget you might have displaying in the sidebar. It also adds a nice accodian to fold up each year.
  8. Finally, we prevent any of the posts from our menu slider category (id=68) from appearing onour post index page (in our case, partials/loop-archive.php). Add this line before the loop: //this is the loop, don't add this.
  9. Additionally, we'd like to show image alt tags. In order to do this find this line in "carousel-horizontal-posts-content-slider/chpcs.php": if (has_post_thumbnail( $post_image_id ) ): $img_arr = wp_get_attachment_image_src( get_post_thumbnail_id( $post_image_id ), $img_size ); $first_img = $img_arr[0]; and directly UNDERNEATH it put: $thumb_img = get_post_meta( get_post_thumbnail_id() ); // Get post ID $slider_alt = $thumb_img['_wp_attachment_image_alt']['0']; // show alt text so the whole thing looks like: if (has_post_thumbnail( $post_image_id ) ): $img_arr = wp_get_attachment_image_src( get_post_thumbnail_id( $post_image_id ), $img_size ); $first_img = $img_arr[0]; $thumb_img = get_post_meta( get_post_thumbnail_id() ); // Get post ID $slider_alt = $thumb_img['_wp_attachment_image_alt']['0']; // show alt text endif; Then find this line in the same file: $first_img = ""; and REPLACE it with this line: $first_img = "\"$slider_alt\"/"; Any alts put into the wordpress admin will not show up in the caraousel image tags. NOTE: we can also simply copy all the Caraousel plug in files from Fusionstudiosinc.com and get all of this functionality.