Skip to:
Content
Pages
Categories
Search
Top
Bottom

having trouble creating a child theme

  • Avatar of mikedark
    Mike
    Member

    @mikedark

    I’ve inherited a project, taking over from another developer who built the site. previous guy did extensive customizations, so it’s been somewhat of a challenge reverse engineering how he built and modded the site/files.

    I’m in the process of modifying the layout, and in the interest of future updates, i want to do it the right way. so i followed this tutorial for creating a child theme for using custom CSS. (http://codex.buddypress.org/theme-development/building-a-buddypress-child-theme/)

    i’ve followed the tutorial exactly, but my mockup for the new homepage layout indicates something is not right. From what i can judge, it appears to me that there is another stylesheet being called by the current site that i have not incorporated into the child theme’s style.css. (i put in only the two in the tutorial).

    here is the link to my mockup: http://bit.ly/dErmwJ

    here is a link to the a pre-mockup where i only included an image file for the changes (as a preview to the client before going forth with writing any custom code): http://bit.ly/hDeWzi

    (sorry didnt want to drop direct links to the site so it doesn’t come up in any search. i hope it is understandable).

    so my question is, do you think i am correct in my assumption that there is another style.css that i am supposed to be importing into the child theme, that i missed? or do you think there is another explanation for why the child theme style is ‘off’? (notice the header area is out of whack, and you can see the links colors are different, (light blue instead of red) and the overall page width is much wider)

    thanks in advance! i hope this is explained well enough, if there is any clarification needed, please let me know!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    === do you think i am correct in my assumption that there is another style.css that i am supposed to be importing into the child theme, that i missed? or do you think there is another explanation for why the child theme style is ‘off’? ===

    Your mockup style.css is importing from the bp-default theme in BP plugin folder http://electioncandidates.com/wp-content/plugins/buddypress/bp-themes/bp-default/_inc/css/default.css
    while the pre-mockup style.css is importing from the bp-default theme in themes folder http://electioncandidates.com/wp-content/themes/bp-default/_inc/css/default.css where the styling has already been revised/customized. Initial scan comparing the stylesheets already shows that min and max width is set to 996px in pre-mockup; while your mockup still has the BP default styling of min width of 960px and max width of 1250px just as an example of the difference.

    Copy over the styling of `default.css` and `adminbar.css` from the pre-mockup to your theme’s `/_inc/css/` folder and change the import call
    from

    /* Inherit the default theme styles */
    @import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/default.css );
    /* Inherit the default theme adminbar styles */
    @import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/adminbar.css );

    to

    /* Inherit the default theme styles */
    @import url(_inc/css/default.css );
    /* Inherit the default theme adminbar styles */
    @import url(_inc/css/adminbar.css );

    cross fingers :-)

    Avatar of mikedark
    Mike
    Member

    @mikedark

    thanks mercime, that was really helpful. but actually, after reading your post, all i did was swap out the URLs in my child theme’s stylesheet, so now i have,

    /* Inherit the default theme styles */
    @import url( ../../themes/bp-default/_inc/css/default.css );

    /* Inherit the default theme adminbar styles */
    @import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/adminbar.css );

    that seems to have done the trick, as now if you visit the mockup2.html page, it looks just like the pre-mockup.

    the next thing i’ll need to do is actually throw the switch by activating the theme in the wordpress admin, i think :) with the above mockup page, all i did was copy the homepage source code and save it as a .html file so i could play around, and linked it to the child theme style.css by changing the link in the head. however to get this live on the site, I’m assuming i have to activate the child theme in the main wordpress dashboard, is this correct? (a little nervous).

    Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    === I’m assuming i have to activate the child theme in the main wordpress dashboard, is this correct? ===

    Yes. Activate the child theme in dashboard of WP site where BuddyPress is installed. So if your BP is in main/primary site, activate child theme in dashboard of main site.

Viewing 3 replies - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.