This is the P2PU Archive. If you want the current site, go to www.p2pu.org!
WordPress Development
My recent threads
You haven't posted any discussions yet.
Recently updated threads
- Has assignment 6 been graded? Wed, 2011-04-06 17:48
- Last assignement urls Wed, 2011-04-06 01:08
- Last Assignment and Course Extension until the 18th of March Sun, 2011-03-13 02:57
- Will there be the final week? Fri, 2011-03-11 15:53
- You still have time for last week's assignment! Tue, 2011-03-01 15:09
2nd Assignment Problems
Go back to: General discussion
From what I gather we are to develop a child theme to be used on top of our theme. What if we are already using a child theme? Should I start over with a base theme, go and create the child theme, or do I just modify the child theme? I guess I wouldn't be learning as much if I just modified it, but it seems as though learning to write css in one week is a lot to do. Confused.
I share your confusion. Also was the posting for twenty-ten just a guide, or should we base it off of it. I suspect he wouldn't care if we started fresh, that was what I was planning on, and then just create a simple child theme from scratch. I don't especially want to use twenty-ten, I have become accustomed to genesis.
I used Genesis as well, with the Landscape child theme. Let's hope we get some clarification, because the sooner I know for sure, the sooner I can start learning to write CSS, not just tweak it, and I think that will take me a while. As will starting over from scratch on a base theme. I just hope I'm not going to be in over my head here, so many people have many more skills with this than I do.
i read it as he wants us to create a child theme. if you are already using a child theme, maybe he wants you to create a grandchild theme?
the process is pretty simple: make a new directory in your themes folder "whateverNameYouWant" and create a style.css file in it. then in the top of the style.css you write:
/*
Theme Name: Whatever Name you Want
Template: folderOfParentTheme
*/
eg if you were using a theme named "foo roxorz" and it was in folder /themes/foo. you would write "Template: foo" even if "foo" is already a child theme of something else, it should work.
that's the bare minimum for creating one. it will have no styling on it of course, but for that you just import the stylesheet if you want with @import url('../foo/style.css'). instructions are in here: http://codex.wordpress.org/Child_Themes
I believe that this assignement has two important parts to consider, one is about styling and "programming" and the other is methodological.
Task 1 -> Give a different style to the posts of a certain category, in relation to the default style of our theme.
Task 2 -> Make the task 1 as a child theme instead of directly modifying the files of the theme that we have chosen in the first assignement of the last week.
So I think that we should not start again from scrash, but we have to create a child theme, as Darren coen has summarized in Darren Coen very well, in the post above.
Hope this help you!
However I would be looking at a grandchild theme, and I think that would just add to the difficulty. To top it off, I know nothing about writing CSS. Would appreciate anyone in the US who can help. I have Skype, google voice and free long distance on my phone.
I don't think a grandchild theme would be necessary. I am in the same position, I used a child theme for lesson 1. I am just going to create a new page within the same child theme. As for help css help, the best resource I found was http://courses.sitepoint.com/practical-css. I am in the states as well. If you want to follow @dannygsmith on twitter I will exchange info with you. Creating pages in genesis is easy, and I can point you to all of the docs.
with respect, it seems pretty clear in my mind, "recommend that you develop a ‘child theme’ ... instead of changing the theme files."
it is much simpler than you guys are making it:
1) make a child theme (folder/style.css)
2) make a couple of basic modifications based on what category the post is in. (.category .post_class {border:solid red;})
in its simplest form thats how i see the assignment. anything else is just gravy. am i crazy?
We are both using the genesis base theme with a separate child theme already for lesson one. Therefore we already have created the child theme. Having a child of a child is just more complexity than anyone would need to go to in my opinion, not sure if it would even work for that matter, as I have seen very little in documentation. Even Justin Tadlock, of the hybrid theme (one of the first) does not recommend grandchild themes.
for the record, i tried creating a grandchild theme and it didn't work.
So we just style the images in a certain category differently wherever they appear on any page?
I don't think wordpress includes the category of an image as one of its classes in the html output. I am thinking I will need to make a functions.php in the child theme to add that, or am I just going way off track?
It it isn't clear if the Client wants the second category posts to appear different on the gallery page, home page, or post page. Are we to assume that the style should be applied that category no matter where it shows up? Maybe I just read it wrong...
On the child theme issue, don't forget why you are here. You're here to learn and the purpose of the tasks is to push you to do that. It's not the end product or the details that matter, it's what you learn in the process.
So, if you are already using a child theme and know how they work, then you've accomplished the goal for that task and shouldn't start over. If you aren't really sure how they work, then do use one (or start over) so you're forced to understand them better.
And, if the directions are vague and you could do it two or more ways, try them both. You'll only learn more. In other words, focus on what you'll learn not the exact details of what Client X wants because Client X isn't paying you and you won't fail the course. :D
can somebody tell me where the assignment requirements are? I did not receive an email and not sure where they are posted. Thanks
never mind, I found it here: http://www.morgadinho.org/2011/02/01/wordpress-development-course-week-1...
I'm sorry to have been awol for so long, a family emergency and an unexpected work deadline has meant that I've been mostly offline since late Friday but fingers crossed I'm back with my learning WordPress hat on, at least today!
I'm hoping that Nuno will be find time to pop in today but I'm sure he would also say that you should do what makes learning sense to you -
- If you're working with the Genesis framework, stick with it, learn more!
- If your goal is to learn more css for WordPress, go for it!
- Child themes? Excellent!
For assignment #2 I think that Darren has nailed it though when he writes:
< quote >
with respect, it seems pretty clear in my mind, "recommend that you develop a ‘child theme’ ... instead of changing the theme files."
it is much simpler than you guys are making it:
1) make a child theme (folder/style.css)
2) make a couple of basic modifications based on what category the post is in. (.category .post_class {border:solid red;})
< end quote >
*But* - do what makes this a learning experience for you!
Also, Herbert Nerder's excellent post above sums it up for me - we're here to learn and the tasks are to facilitate that learning - you can use the tasks in the way that suits *you* best. And by sharing your thoughts you're undoubtedly helping others sort through what they need to do, it's a win-win situation :-)
Child of child themes/grandchild themes
---------------------------------------
I too researched this a little a while back and I didn't think there was a satisfactory solution yet but if anyone knows more, do post. How about starting a new discussion thread for Grandchild themes? Darren, would you mind starting that off and sharing your research?
Wordpress Book
--------------
Do we want to choose one book to work from? I'm not sure that it would work - not everyone will want/have access to the same book? What do you think?
The goal is to fulfil the requirement, i.e. style the post according to the category. If you use Twenty-ten or Genesis is really up to you, as it would be if this was a real client.
If you're already using a Child theme then you're one step ahead :) In that case you just need to create the necessary CSS. You won't need to learn all about CSS of course, just the bit necessary to accomplish the task.
Hi Nuno,
Your "Main Page" codex reference help me to identyfy the resorce that require for this assignment.
it is a "Theme Development" point.
i am going to appy it in my assignment and sumbit here ones complete.
Hi all
I am using http://codex.wordpress.org/Theme_Development as my reference here , The Key requirement of the assignment is that we display a different style for a category , I stumbled on this code for making that happen
<?phpif ( is_category( '9' ) ) {
get_template_part( 'single2' ); // looking for posts in category with ID of '9'
} else {
get_template_part( 'single1' ); // put this on every other category post
}
?>
I am not sure what 'single1' and 'single2' are referencing here , how do we make them to point to the specific style sheet ?
Praveen
Hi Praveen
I think Nuno will be along today to answer properly but having a quick read of that Codex page (I plan to work on this at the weekend), I think that single1 and single2 are examples of template files being called in. Elsewhere on that page it says:
< snip >
Including Template Files
To load another template (other than header, sidebar, footer, which have predefined included commands like get_header()) into a template, you can use get_template_part(). This makes it easy for a Theme to reuse sections of code.
< end snip>
That is, the author of this codex doc has used single1 and single 2 as example names to show this? Anyone want to chip in and tell us if we're right or wrong?
Daisy
Yep. get_template_part is a generic include function to bring a template in where single1 would fetch single1.php in your theme directory. But, the point of this would be to use different markup for different categories (single1.php and single2.php would contain different loop markup). You could do that, but for this task we don't even need to go that far necessarily.
All we need is something in our loop to target the category via CSS. A lot of themes might provide this already, and if not, there are a couple simple ways to do it yourself. It's worth doing manually to learn how, btw. I don't want to give it all away (unless needed) so you have something to dig through the codex for :p, but remember that you'll want each category to have it's own unique class name.
If anyone's not sure about the main goal of Assignment #2, here's a quick conversation from the chat room:
Daisy:
"I understand it to mean that we need to style all posts in one category differently. So for example, all the posts in the Wedding category could have a background image of little hearts and the post title be in red?"
Nuno:
"That's exactly it, all the posts in the X category could be aligned to the right or left, i.e. in some way different than the others."
Hope this helps!
Daisy
Yeah, there are basically two ways it could be interpreted. First, which is the way I understood it, would be to make sure that each category can be targeted via CSS only. The second would be two create two separate loops or lists of posts, a new one for a particular category (which could to some degree be emulated with css floats).
I thought it was clearly the first way. But, like I said before, there's no reason not to try both if you have extra time. Both are useful techniques to know.
The way I understood the assignment, we are to change how the posts in certain category look using CSS only. However, everything I can find involves function calls and editing the php. How do I target each category using CSS only. Any help pointing me in that direction would be appreciated. The more I research, the more I can't find what I'mm looking for, and I don't even know where in the CSS stylesheet to put it once I find it, but I guess that's another issue entirely.
Yep, you should be using CSS, but there's more to the lesson. Depending on if the theme you are using has provided the necessary hooks, you may already be able to use a selector like .category-news for a "news" category (selector may vary). You could use an inspector tool like Firebug to check for an existing category hook.
But, where the PHP comes in is how that class name is automatically added for you to use and probably what we're supposed to be learning. Wordpress has a built in function called post_class() that will output a number of classes relevant to that post when it's used inside of "the loop". That's the easy way. You could also create your own version of post_class() using other template tags to output the necessary classes for the post.
See the codex page for "the loop", and the list of template tags. Then open up your index.php or whatever template displays your posts and start playing around. Add in post_class() or remove it. Try adding various tags/functions into your post loop and you'll start to get the picture of what's going on. Even if your CSS hooks are already there, you should be aware of why. :D
http://codex.wordpress.org/The_Loop
http://codex.wordpress.org/Template_Tags
http://codex.wordpress.org/Function_Reference/post_class
Many thanks Herbert. I think I'll be back tonight to talk some more about this... ;-)
I was thinking that in order to get the Category X posts to show up a certain way no matter where they appear might be to use this post_class function.
I'm working with the AutoFocus+ theme and decided to use icons alongside the header to differentiate the categories on the home page. The challenge I had was matching the positioning for the hover state which now finally works in FF on the Mac.
I then added an action hook in the functions.php to include a legend before the content area.
I hope this helps - http://www.greggwatt.com/webcraft/
Gregg, I'm afraid I'm out of my league trying to modify the theme like you did. I would be interested in seeing the specifics of where you modified the them (I used autofocus for my first assignment but after a few hours today I think that this one is a little above my pay grade). If you'd be willing to share a zip of your modified theme so that I can compare the files and see where you modified the loop/etc. I think I could learn a lot.
Kudos and nice work.
Hi Joseph, I just sent you an email offline so that I don't clutter this thread with code. Let me know if you have any other questions.
Cheers, Gregg
This is the SECOND time I've setup a child theme and when I hit ACTIVATE it takes my whole site offline - 500 Error.
I had to start from scratch before.. I don't want to do it again a third time.......!!
What all is in your child theme? You should zip/package it and give us a link to try it out. Maybe somebody could track down what's causing it.
I created a directory in the Themes folder called f8-lite-child. The only thing in it is a style.css. That file only has the following:
/*
Theme Name: f8-lite Child
Theme URI: http://graphpaperpress.com/themes/f8-lite/
Description: Child theme for - F8 Lite - A photography & multimedia portfolio theme for Wordpress
Author: Allen May
Author URI: http://bouncy.no-ip.org
Template: f8-lite
Version: 0.1.0
*/
@import url("../f8-lite/style.css");
#masthead a {
color: #009900;
}
I haven't tried to reproduce it, but if I had to guess I'd say it's that @import rule. That style.css probably includes the theme info for the parent theme, right?. So, WP might not know which theme to use, the child or the parent.
I'd start by copying your actual css from the parent theme to the child so you don't need that @import. Or put the parent theme's css in another css file that you could then safely import. But, typically, you'd just copy over all the css or just the rules that you want to override in the child.
For my solution I went down the route of including the post_class function in the appropiate templates, and then styling my child theme.
Here's my 2nd assignment - learned a lot.
http://seanmcauliffe.com/p2pu/
Now I need to customize the AutoFocus child theme more so it doesn't look like the other AutoFocus child theme I just saw :)
I spent days working on this child theme thing. Turns out the theme I used was making life difficult. Easy to do if you use a theme like Twenty Ten, but hard if you use something like those from Elegant Themes.
So now that I wasted all this time, I thought I was moving onto the easier part of this assignment - restyling categories. But of course I am having trouble with that too.
Are we seriously having to work in PHP and modifying The Loop already? I can't just use more CSS without heavier coding? I found the spot of the codex everyone was hinting at above.
Most of the themes that I've messed with have already provided hooks for categories because post_class() does. But, if you were building your own theme, you'd have to know to add that. So, you might not HAVE to touch any PHP, but I'd certainly want to get my hands dirty and learn either way.
Thanks Herbert. I am taking your advice and trying to "get my hands dirty" now. To get the assignment done, I found a template that made so I didn't have to learn the PHP. But I'm going back to learn it proper now.
Guess I was just frustrated at how quickly this class got serious on me. CSS and PHP in the same assignment - eek!
Hi Christopher, I was very busy this week and I have not been able to dedicate myself to this assignement till tonight. And,unfortunately, I started the house through the roof and when I finished the styllization of my second category I realized that I should have created first the child theme and have made the changes under this child theme. Well, I read the child theme documentation and I begin the process, but as you said, this is not easy with a theme from elegantthermes. Did you find the solution, because I can't achieve that wp reads my childs style.css. And at this moment, here are 3:48 a.m, I'm very tired and can't resolve this little (or not) triick.
But, at least, I can tell you how I can achieve the styling thing, directly in the ePhoto theme:
My second category that will be stylled different from "Casual Work" category is "Macro flowers", that have id=4 or slug="macro".
In order to achieve that the "macro flowers'" single posts were stylled different from others, I modified the single-photo.php file, with one line that checks if the current post is inside the "macro" category:
<?phpif(in_category('macro')): $varClassMacro = 'especial'; else: $varClassMacro=''; endif;
?>
Then, where the code are apllying the "thumbnail-single" class to the photo's container div, I insert a little of php in order to give a new "especial" class to the div or to the title:
<div class="thumbnail-single <?php echo $varClassMacro;?>">(...)
<h1 class="post-title <?php echo $varClassMacro;?>"><?php the_title(); ?></h1>
Then, I only need to modify the style-black.css, and insert at the end of it the new class, with the features that I want and an !important to give them priority.
.especial {color: #f4bd2a!important; border-color: #f4bd2a!important; }Something similar I've done with the other php templates and making a few new classes in the css
thumbnail.php --> for gallery pages
featured.php --> for the featured area of the home page
footer-area.php --> for the footer area of all the site
But after all this work, that rules perfectly, I¡ve tried to make the child theme, and I have'nt had any success. Maybe tomorrow, on sunday morning I achieve a better level of aknowledge! :-)
I go to the bed!
Núria
nuria next time you can just use post_class() like herb said.
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>http://codex.wordpress.org/Function_Reference/post_class
Thnaks, Darren, really is better clear and cleen. I'll use it.
No, I had no luck either. Gave up on ElegantThemes and went for a new install with TwentyTen just to get the assignment done.
Christopher, any help about the problem of the eleganthteme child themes? It will be very apreciated!
Núria
Núria,
I used Twenty-Ten to finish the assignment. But I went back today and looked deeper into how Elegantthemes handles it. As their name implies, it is... elegant. A simple solution:
In your admin panel, just go to the ePanel for the theme itself. Go to the Colorization sub-menu. Then there is an option to activate called "Enable child stylesheet". And below that, a field asking for the URL. A URL starting with "/wp-content/..." is all you need. My guess is that it re-writes all the images and plug-in references. Pretty cool, huh?
Sorry for the delay. Again, I didn't think child themes were something requiring work-arounds by template authors. Maybe it is a new feature in WP?
Hi All,
Here is my second project: http://webcraft.wordpressrehberi.com/week1/
I tried to explain how I did that in this post: http://webcraft.wordpressrehberi.com/week1/?p=32
Also, I want to ask something, what kind of custumizations do for the child theme in terms of design or property?
Take care!
Hi,
I'm having troubles with my child theme to begin with. I have created a style.css with the following in it:
/*
Theme Name: My First Child Theme
Description: Child Theme for Anthology_1.3
Author: Barbara Langendoen
Template: Anthology_1.3
*/
@import url ('../Anthology_1.3/style.css");
When I activate the child theme and look at my site all the styling is gone!! What am I overlooking here?
fyi I did the same with twentyten and had exactly the same issue.
Hopefully someone can help me.
Barbara
did you use space between url and ()? remove it and try again.
Thanks Alexey! That was it.
You are welcome :)
I have been struggeling for a while now.
www.p2pu.barbaralangendoen.nl/gallery
I can style the home page by adding css styles in my child theme. I cannot seem to change anything regarding the images in the gallery page.... I was trying to find hooks for the 2 categories. They are not there. How do I create the hooks or is there an other way?
I found id:gallery class: single_image
for instance
#gallery .portfolio-item {
background-color: black;
}
this did not have any effect.
Any comments on how to proceed. Is it in the theme I chose?
Thanks again so much!
Barbara
Barbara,
What plugin are you using for the gallery? If we try it out maybe we can help.
--Sean
Hi Sean,
The gallery came with the theme.
http://themeforest.net/item/anthology-premium-elegant-wordpress-theme/13...
When I read the theme documentation I assume the plugin used for the gallery is
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox...
Maybe it is easier to use another plug in to make a new gallery which can be formatted easier.
Thanks
Barbara
I am using the theme' Boldy'. This theme doesn't seem to support child themes(lame!). I came to this conclusion because none of the styles I implemented in the child theme have been showing up, but if I put the same styles in the parent theme, it shows up fine. I think i did everything there is to do and Boldy just doesn't support child themes. I have scoured the web for hints on adjusting a theme to support child themes and no luck, any ideas on how to do this?
hello all,
did spend most of the available time last 3 days to learn and work on this assignment. learnt about child theme & demonstrated how it works. read a lot on loops and post class. think i understand most of the concept. The hooks are still tricky... Herbs & many others did provide very useful guides to tackle the task. believe the idea is to check for and flag the "chosen" category within the loop. then allow css to take care of special post output... and yet, my proficiency in php & css languages is lacking ... didn't manage to get it working. (tempted to use the TwentyTen exact loop for "gallery" (feel like it'll be cheating). As Alexey suggested on a different thread, will work on gaining more background on php & hopefully will be in a better position for the next assignment.
Meanwhile, would be grateful to learn from other php coding for this assignment. Can some of you post? appreciated.
dan
tired, somewhat disappointed but not giving up
I see there is a lot of chatter back and forth and i'm sure most of us have spent a fair amount of time in the WordPress Codex, on google, on other random sites. I wanted to share with you all the bare minimum i felt we needed to accomplish to get this done - i'll be updating this in real time, but i wanted to share.
http://mykehoff.com/p2pu
Using the default twentyten as my theme, i created a new child theme (named it twentyten-child) - i inserted the following code:
/*
Theme Name: Twenty Ten Child
Theme URI: http: //example.com/
Description: Child theme for the Twenty Ten theme
Author: Myke Hoff
Author URI: http: //example.com/about/
Template: twentyten
Version: 0.1.0
Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style
*/
/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
@import url("../twentyten/style.css");
.casual {
color: #333;
font-size: 6px;
line-height: 24px;
}
- Using child of twentyten (appropriately named twentyten-child)
- adjust the way the "casual" category is being displayed by adjusting the style.css sheet
(still working on this) - but for now it was a simple as adding code:
.casual {
color: #333;
font-size: 6px;
line-height: 24px;
}
From here i created functions.php and inserted the following code:
<?php
function favicon_link() {
echo '<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />' . "\n";
}
add_action('wp_head', 'favicon_link');
// category nicename in body and post class
function category_id_class($classes) {
global $post;
foreach((get_the_category($post->ID)) as $category)
$classes[] = $category->category_nicename;
return $classes;
}
add_filter('post_class', 'category_id_class');
add_filter('body_class', 'category_id_class')
?>
this allowed me to call out the .casual category in my stylesheet. i'm still looking to make sure i can compartmentalize the changes to NOT affect the sidebar as well as make most drastic changes via the stylesheet. but it's a basic starting point.
i don't get it.. why using a child theme when you can modify the loop with post_class to generate the category ID in your markup and then do the styling in CSS for the posts under that specific category?.. it takes seconds to do this: http://farajoomla.com/p2pu/wordpress/blog/
Because if you apply an update to the theme you're using, the changes you've made to the theme would be lost.. whereas changes with a child theme would be independent from its parent theme. Of course, if you're not using a downloaded theme but have written your own then it's a different story.