Sterling – Link to Specific Categories in Gallery

[box type=”note”]If you’re interested in hiring a developer to implement these changes for you we’ve got 2 highly trusted partners for all of your WordPress customization needs. WPQuestions.com and Codeable.io[/box]

Overview:

In this tutorial we’re going to provide instructions on how to modify the Theme so that you can link to specific categories within your Gallery pages. For example, lets say you have a Gallery page with “Web” “My Print” and “Logo” filtering categories. You then have a “Company info” page and would like to link directly to the “My Print” category. This tutorial will show you how.

Sterling Theme:

General Instructions:

  1. Modify navigation.php file
  2. Modify functions.php file
  3. All done 🙂 Use new URL string to link to specific category.

Step 1: Modify navigation.php file

  1. Open navigation.php in the code editor of your choice. This file is located within Sterling theme here: /wp-content/themes/Sterling/framework/theme-specific/navigation.php
  2. Scroll down to line 201 and look for this code:
    $link = '<a href="#" data-filter=".term-'.$category->term_id.'" ';
  3. Replace the above code with the following:
    $link = '<a id="'.$category->slug.'" href="#" data-filter=".term-'.$category->term_id.'" ';
  4. Save the file. All done with navigation.php

Step 2: Modify functions.php file

  1. Open functions.php in the code editor of your choice. This file is located within Sterling theme here: /wp-content/themes/Sterling/functions.php
  2. Add the following code anywhere within functions.php:
    function tt_activate_filter_link(){ if(isset($_GET['active_category'])): $active_cat = esc_attr($_GET['active_category']); ?> <script type='text/javascript'> jQuery(window).load(function(){ jQuery('#<?php echo "$active_cat" ?>').click(); }); </script> <?php endif; } add_action('wp_footer','tt_activate_filter_link');

Step 3: Use new URL string to link to specific category

  • Using the example above, here’s how we would link directly to the “My Print” category, we would need to append the category slug to end of url: http://www.yourwebsite.com/gallery/?active_category=my-print
  • Notice the ?active_category=my-print at the end of the URL string.
  • Simply replace “My Print” with your category’s slug “my-print” and you’ll be all good to go.
  • One more example… http://www.yourwebsite.com/gallery/?active_category=truethemes


Karma Theme:

General Instructions:

  1. Modify functions.php file
  2. All done 🙂 Use new URL string to link to specific category.

Step 1: Modify functions.php file

  1. Open functions.php in the code editor of your choice. This file is located within Karma theme here: /wp-content/themes/Karma
  2. Scroll down to line 891 and look for this code:
    $link = '<a href="#" data-filter=".term-'.$category->term_id.'" ';
  3. Replace the above code with the following:
    $link = '<a id="'.$category->slug.'" href="#" data-filter=".term-'.$category->term_id.'" ';
  4. Scroll down to the bottom of the file
  5. Add the following code anywhere just before the ?> Tag:
    function tt_activate_filter_link(){ if(isset($_GET['active_category'])): $active_cat = esc_attr($_GET['active_category']); ?> <script type='text/javascript'> jQuery(window).load(function(){ jQuery('#<?php echo "$active_cat" ?>').click(); }); </script> <?php endif; } add_action('wp_footer','tt_activate_filter_link');
  6. Save the file. All done with functions.php

Step 3: Use new URL string to link to specific category

  • Using the example above, here’s how we would link directly to the “My Print” category, we would need to append the category slug to end of url: http://www.yourwebsite.com/gallery/?active_category=my-print
  • Notice the ?active_category=my-print at the end of the URL string.
  • Simply replace “My Print” with your category’s slug “my-print” and you’ll be all good to go.
  • One more example… http://www.yourwebsite.com/gallery/?active_category=truethemes