Page 1 of 2 12 LastLast
Results 1 to 10 of 18

Thread: Make Standard Classipress CATEGORIES Menu a CLICK Down Menu

  1. #1
    Thread Starter
    Veteran vienna's Avatar
    Join Date
    May 2010
    Location
    Vienna, Austria
    Posts
    718
    Thanks
    19
    Thanked 177 Times in 118 Posts

    Make Standard Classipress CATEGORIES Menu a CLICK Down Menu

    I always customize Classipress for SEO purposes, so I first place the Menus in another part of the page.

    BUT...lots of people are using Classipress 3.1.3 or 3.1.4 with the standard Menu Navigation Bar at the top with the display SETTINGS for "Standard" Front page. You just want to get to the listing as soon as possible and rely on people hovering over the "Categories" link to see the dropdown menu.

    However, in my case I have so many categories that the Hover was downright annoying. As soon as I would try to look at the whole menu it would disappear. Then I would do the sneaky, eternally stupid, let's see if I can catch the browser "off guard" and scroll down the page super quick before the menu faded out.

    The browser always wins!

    I looked for a long long time for time and posted here asking for a dropdown ONCLICK solution. I wanted to CLICK the mouse on "Categories" and have the menu open up and STAY OPEN. Then I could scroll around and not see my menu disappear just as I was finding the category I wanted.

    And I figured that most of my users would find the same frustration if I did not fix this issue in my case.

    MAKE that Categories Dropdown a Click Down and STAY Menu

    So, here is how to modify Classipress 3.1.5 (it will work in 3.1.5 when it is released), 3.1.4, and 3.1.3.

    It involves a change to --

    1 ... header.php

    2 .... includes/theme-header.php

    3. ... style.css

    In the header I will post the entire header.php code for a visual reference.

    ---------- Part 1 : Messing with the header.php file --------------

    PHP Code:



    <?php global $app_abbr?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    <head profile="http://gmpg.org/xfn/11">
      <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />    <?php appthemes_meta(); ?>
      <title><?php wp_title('|',true,'right'); ?><?php bloginfo('name'); ?></title>
      <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php if ( get_option('feedburner_url') <> "" ) echo get_option('feedburner_url'); else echo get_bloginfo_rss('rss2_url').'?post_type='.APP_POST_TYPE?>" />  <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />  <?php if ( file_exists(TEMPLATEPATH.'/images/favicon.ico') ) { ?><link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory'); ?>/images/favicon.ico" type="image/x-icon" /><?php ?>
      <?php if ( is_singular() && get_option('thread_comments') ) wp_enqueue_script('comment-reply'); ?>        <?php wp_head(); ?>

    <script type="text/javascript" src="jquery.js"></script><script type="text/javascript"> /* Category nav drop down */function toggle_slide(id_name) {  jQuery('#'+id_name).slideToggle('fast');// open/close slide menu}
    /* Category nav drop down */function selected_slide(id_name, form_id_place, form_name_place, id_cat) { // checked slide variable  var ObjectForm = document.getElementById(id_name); // init slide  var Element = ObjectForm.parentNode.getElementsByTagName("li"); // init slide element  for (i = 0; i < Element.length; i++) { // choose slide element      ElementHref = Element[i].parentNode.getElementsByTagName("a"); // init Tag A      attribute = ElementHref[i].getAttribute("rel"); // init ID element      Element[i].removeAttribute("class"); // delete checked old slide menu selected      if (id_cat == attribute) {  // init selecte element          save_slide(form_id_place, form_name_place, attribute, ElementHref[i].innerHTML); // save data          Element[i].setAttribute("class", "active"); // checked slide menu selected element      }  }  toggle_slide(id_name); // close slide menu}
    /* Category nav drop down */function save_slide(id_place, name_place, var_id, var_name) {  document.getElementById(id_place).value = var_id; // write ID element  document.getElementById(name_place).innerHTML = var_name; // write name Element  return 0;}
    /* initialize the form validation */jQuery(document).ready(  function(){      jQuery("#mainform").validate({          errorClass: "invalid"      });  });
    // ]]>$(document).ready(function($){$(".adv_categories").click(function(){  $(".adv_categories").slideToggle("fast");  $(this).toggleClass("active");  return false;});});</script></head>
    <body <?php body_class(); ?>>    <?php appthemes_before(); ?>
          <div class="container">
              <?php if ( get_option('cp_debug_mode') == 'yes' ) { ?><div class="debug"><h3><?php _e('Debug Mode On','appthemes'); ?></h3><?php print_r($wp_query->query_vars); ?></div><?php ?>
              <?php appthemes_before_header(); ?>                    <?php appthemes_header(); ?>                    <?php appthemes_after_header(); ?>
              <?php include_once( TEMPLATEPATH '/includes/theme-searchbar.php' ); ?>

    replace your existing header.php with the code above and send it up to your site into your Classipress theme folder after backing up your existing header.php file


    and now...

    ------ Part 2 ... Modifying includes/theme-header.php .....-----------------

    Coming up!

    Next part of this tutorial in the next post....



  2. The Following User Says Thank You to vienna For This Useful Post:

    franky (October 14th, 2011)

  3. #2
    Thread Starter
    Veteran vienna's Avatar
    Join Date
    May 2010
    Location
    Vienna, Austria
    Posts
    718
    Thanks
    19
    Thanked 177 Times in 118 Posts

    Part 2 .. making a Click Down Categories Dropdown Menu

    You must be an AppThemes customer and logged in to view this response. Join today!

  4. The Following User Says Thank You to vienna For This Useful Post:

    franky (October 14th, 2011)

  5. #3
    Thread Starter
    Veteran vienna's Avatar
    Join Date
    May 2010
    Location
    Vienna, Austria
    Posts
    718
    Thanks
    19
    Thanked 177 Times in 118 Posts

    Step 3 & LAST step of Tutorial for making Categories a Click Menu

    You must be an AppThemes customer and logged in to view this response. Join today!

  6. The Following User Says Thank You to vienna For This Useful Post:

    franky (October 14th, 2011)

  7. #4
    Thread Starter
    Veteran vienna's Avatar
    Join Date
    May 2010
    Location
    Vienna, Austria
    Posts
    718
    Thanks
    19
    Thanked 177 Times in 118 Posts

    HEADER.PHP Code IMPROVED !

    You must be an AppThemes customer and logged in to view this response. Join today!

  8. The Following 2 Users Say Thank You to vienna For This Useful Post:

    franky (October 14th, 2011), kimtuoc28 (August 9th, 2016)

  9. #5
    Veteran barukar's Avatar
    Join Date
    Sep 2010
    Location
    Brasil, São Paulo, SP
    Posts
    6,785
    Thanks
    186
    Thanked 742 Times in 623 Posts
    You must be an AppThemes customer and logged in to view this response. Join today!
    -------------------------------------------------------------------------------------------
    Projects: ClassiNoiva - Classimóveis - vocênoenem - i50 - Clube DETRAN

  10. #6
    Amateur zontor's Avatar
    Join Date
    Apr 2010
    Location
    New Zealand
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts
    You must be an AppThemes customer and logged in to view this response. Join today!

  11. #7
    Veteran wighty's Avatar
    Join Date
    Mar 2011
    Location
    UK
    Posts
    291
    Thanks
    20
    Thanked 10 Times in 9 Posts
    You must be an AppThemes customer and logged in to view this response. Join today!

  12. The Following User Says Thank You to wighty For This Useful Post:

    zontor (October 16th, 2011)

  13. #8
    Thread Starter
    Veteran vienna's Avatar
    Join Date
    May 2010
    Location
    Vienna, Austria
    Posts
    718
    Thanks
    19
    Thanked 177 Times in 118 Posts

    Easy modification

    You must be an AppThemes customer and logged in to view this response. Join today!

  14. The Following 2 Users Say Thank You to vienna For This Useful Post:

    franky (October 14th, 2011), zontor (October 16th, 2011)

  15. #9
    Senior Member binh's Avatar
    Join Date
    Aug 2011
    Location
    Finland
    Posts
    170
    Thanks
    17
    Thanked 11 Times in 9 Posts
    You must be an AppThemes customer and logged in to view this response. Join today!

  16. #10
    franky's Avatar
    Join Date
    Jul 2011
    Location
    Sarf Lundon Somwere In The Middle
    Posts
    413
    Thanks
    52
    Thanked 9 Times in 9 Posts
    You must be an AppThemes customer and logged in to view this response. Join today!

Page 1 of 2 12 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. Removing 'categories menu' from the top menu bar
    By message4wale in forum Report ClassiPress Bugs
    Replies: 5
    Last Post: August 7th, 2011, 12:55 PM
  2. instead of categories can i make that drop down menu
    By erroloz in forum ClassiPress General Discussion
    Replies: 2
    Last Post: August 1st, 2011, 03:08 PM
  3. Trying to make the main categories to stand out in the the drop down menu
    By maurixius in forum ClassiPress General Discussion
    Replies: 7
    Last Post: June 29th, 2011, 03:45 AM
  4. Top nav menu : dropdown categories display on click ?
    By scruffy in forum ClassiPress General Discussion
    Replies: 10
    Last Post: May 2nd, 2011, 01:05 AM
  5. Replies: 1
    Last Post: July 25th, 2010, 10:17 AM