Created
February 28, 2014 21:59
-
-
Save dpawluk/9280873 to your computer and use it in GitHub Desktop.
Simple script that can be added to a Help Center using the Humble Squid Theme. Will give category boxes a background images specified in the array of links to substitute.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Begin Humble Squid Category Image Boxes JS Snippet | |
cat_list = $("ul.category-list li"); // jQuery object containing the category list elements | |
link_list = $("ul.category-list li a"); // jQuery object containing the category list link elements | |
// hardcoded array of image assets for use with categories | |
image_links = [ | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg",//replace with actual image links from your Help Center's assets | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg", | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg", | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg", | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg", | |
"//p1.zdassets.com/hc/theme_assets/link/to/images/for/categories.jpg", | |
]; | |
total_cats = $("ul.category-list li").length; //number of categories we need to iterate over | |
for (var x = 0; x < total_cats; x++) { //loop to add images to category list elements then strip links of borders and text | |
var a_cat = cat_list[x]; | |
$(a_cat).css("background-image", "url(\"" + image_links[x] + "\")"); //addes background images | |
var a_cat_link = link_list[x]; | |
$(a_cat_link).text(""); //strips link text | |
$(a_cat_link).css({ | |
'border': '0px', | |
'width': '100%', | |
'height': '100%', | |
'margin': '0px' | |
}); | |
} | |
//End Humble Squid Category Image Boxes JS Snippet |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment