Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Eric Kidwell
Eric Kidwell
12,327 Points

Wordpress Project or Deep Dive on Picking Apart Themes?

Is there a Wordpress class on Treehouse that teaches how to use a theme you didn't create and, specifically, teaches you how to figure out which files are creating various parts of the theme?

For example, if I want to try to figure out what files are causing the navigation of a theme to be sticky and load on the bottom then scroll to the top and stay at the top, what would I do to figure that out?

If there isn't a class yet that teaches how to find the various parts of a theme and then edit those parts, I think that'd be a great one!

2 Answers

Timothy Rimnac
Timothy Rimnac
26,219 Points

To my knowledge, this is not covered in any Wordpress Project/Deep Dive. All themes are built differently and can use a vastly different structure with they're custom files. I would start by checking the documentation of the theme if possible to see if it gives any sort of file structure.

Other than that it's really just up to digging into the theme using developer tools to find where styles are coming from. If you're using OS X then I recommend Espresso as it's a great way to select an element and know exactly what style sheets are affecting it. If not then using Chrome Developer Tools can also be a great help, especially with the Coda Cola extension.

Sorry I couldn't be more of a help. What theme are you using?

Eric Kidwell
Eric Kidwell
12,327 Points

I'm working with an elegant themes theme called Harmony. You can check out the site I'm working on here: http://jordancundiff.com

The last thing I'm trying to figure out is how to create a sticky nav that loads at the bottom then scrolls and stays fixed at the top. I posted a forum topic here: https://teamtreehouse.com/forum/how-to-create-a-sticky-navigation-bar-that-becomes-fixed-to-the-top-after-scrolling

Timothy Rimnac
Timothy Rimnac
26,219 Points

There appears to be javascript embedded into the HTML that does this. View the page source and do a search for sticky will find you this code. More specifically it happens with this code:

if (winscroll > eltop) {
        $("#main-nav").addClass('sticky-element-fixed');
        $("#main-nav").css("left", elleft);
        $("#main-nav").css("margin-left", 0);
        $('#clone').css('height',elheight);
      } else {
        $("#main-nav").removeClass('sticky-element-fixed');
        $("#main-nav").css("left", "auto");
        $("#main-nav").css("margin-left", elleftmar);
        $('#clone').css('height',0);
      }
Eric Kidwell
Eric Kidwell
12,327 Points

Yeh, I found a plugin in the mean time that helped with having it stick at the top. But what I don't understand how to do now is how to make it autoload on the bottom of the page?

Bella Ratmelia
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Bella Ratmelia
Front End Web Development Techdegree Graduate 28,947 Points

There is a project on how to build a Wordpress theme, though. Maybe you want to start from there. Logically, if you know how to create a theme, then it will be easier for you to "break apart" a theme.

Eric Kidwell
Eric Kidwell
12,327 Points

I understand, thanks for answering :D I'm more interested in something that is pointed to this specific topic of "ok, you've bought a theme, here's how to BEND IT TO YOUR WILL!!" type of project

I need something that will show me how to "connect the dots" between the HTML, CSS, PHP and JS (namely PHP and JS)