Author Topic: Child Theme questions (Read 10142 times)

steheap · « **on:** March 31, 2013, 18:48 »

Sorry if I have missed this, but how do you install and then use the Child Theme? Do you just upload and activate it as you do for Symbiostock, or does it need to sit elsewhere in the folder structure?

Steve

cathyslife · « **Reply #1 on:** March 31, 2013, 18:49 »

I just uploaded the symbiostock theme, then the child theme. Then activated the child theme. It went into my root folder.

steheap · « **Reply #2 on:** March 31, 2013, 19:33 »

I need to research this - what do you then do with the child theme?

grsphoto · « **Reply #3 on:** March 31, 2013, 19:40 »

the child theme is where you make any major changes to styling etc.,

You leave the parent alone.

You do this so that future updates will work, and you will want to apply them to the parent, which then gets passed to the child.

cathyslife · « **Reply #4 on:** March 31, 2013, 19:48 »

Yes what grsphoto said. Treat the child theme as tho it were the parent. If you make changes to css, make the changes in the child css window. If updates are made to the parent, your customizations will be saved because they are in the child.

klsbear · « **Reply #5 on:** March 31, 2013, 20:23 »

Quote from: cclapper on March 31, 2013, 18:49

I just uploaded the symbiostock theme, then the child theme. Then activated the child theme. It went into my root folder.

Cathy, this is what I did but I'm not sure it's set up as it should be. When I go to Appearance/Themes/Manage I have the child theme showing as the current them and it refrences that it requires it's parent them SYMBIOSTOCK (it's not the error I had previously where it was saying the parent wasn't installed). I see the parent theme listed with the "available" themes below. When I look at the root directory I see both Symbiostock and Sybiostock-child listed as separate themes. Does this sound like I have it set up correctly ?

steheap · « **Reply #6 on:** March 31, 2013, 20:28 »

I think that is correct. The theme is now the child although the main functionality is still there.

steve

steheap · « **Reply #7 on:** March 31, 2013, 20:49 »

This could be a good thread for questions about how to change how the sites look!

Who knows how to stop the "author" of each post/image from showing? I've looked through all the options, but don't seem able to stop that from appearing, and also not sure how to stop the comments box from appearing either!

Steve

cathyslife · « **Reply #8 on:** March 31, 2013, 20:57 »

Quote from: klsbear on March 31, 2013, 20:23

Quote from: cclapper on March 31, 2013, 18:49
I just uploaded the symbiostock theme, then the child theme. Then activated the child theme. It went into my root folder.

Cathy, this is what I did but I'm not sure it's set up as it should be. When I go to Appearance/Themes/Manage I have the child theme showing as the current them and it refrences that it requires it's parent them SYMBIOSTOCK (it's not the error I had previously where it was saying the parent wasn't installed). I see the parent theme listed with the "available" themes below. When I look at the root directory I see both Symbiostock and Sybiostock-child listed as separate themes. Does this sound like I have it set up correctly ?

Yes, both themes need to be there, but you will activate the child theme. Basically, everything is being used from symbiostock theme thru the child. But any changes made need to be made on the child, so if the parent changes (like if leo does an update), your modifications remain. I know, its a little confusing. I was looking for a way to activate both themes because i thought thats what was needed, but its only possible to activate one. I remember leo saying in one of the threads to work on the child theme. I hope i am explaining it correctly...

And yes, both folders show in the root directory.

steheap · « **Reply #9 on:** March 31, 2013, 21:50 »

Can anyone tell me how to get rid of, or change, the menu items up in the top right of the default design?

Steve

Leo Blanchette · « **Reply #10 on:** March 31, 2013, 21:51 »

LOL looks like I'll be making a video after all. Stay tuned for a few minutes. I had already made one...but I'll make a more pointed one.

THP Creative · « **Reply #11 on:** March 31, 2013, 22:24 »

Quote from: steheap on March 31, 2013, 21:50

Can anyone tell me how to get rid of, or change, the menu items up in the top right of the default design?

Steve

Hey steve, go to Appearance, Menu's and then Create a Menu. Once you have created a menu, you should see a box on the left that contains 4 dropdown menus for 4 different menu locations. You can create 4 menu's, one for each location. Add pages to each menu by simply ticking the page and clicking "Add to Menu", then save. Then select the right menu for the right location in the Theme Locations box on the left, save it and it should all work!

Leo Blanchette · « **Reply #12 on:** March 31, 2013, 23:15 »

Quote from: steheap on March 31, 2013, 21:50

Can anyone tell me how to get rid of, or change, the menu items up in the top right of the default design?

Steve

http://www.microstockgroup.com/symbiostock-development-area/need-help-with-navbar/msg307584/?topicseen#new

steheap · « **Reply #13 on:** April 01, 2013, 14:20 »

Great thanks!

Another question for you wordpress experts. When I click on one of my images and see the pricing etc. There is a block of urls for MSG, Sybiostock etc. I've already got those on the home page, and I think it spoils the professionalism to have them on each image page. How do I delete those from an image page?

Steve

THP Creative · « **Reply #14 on:** April 08, 2013, 22:46 »

I'm not real great with CSS (actually, pretty terrible!) but I am using the child theme and was trying to change the appearance of the footer. So I copied these tags from the parent style sheet, pasted them in the child one, and removed the black PNG in the footer. But it's not working!

footer.site-footer {
   background-color: #F4F4F4;
   border-top: 7px solid #333;
   padding: 20px 20px;
   color: #CCC;
   }
footer .footer_section{
   padding: 10px;
   border-radius:14px 14px;
   border: 1px solid #333;
   margin-bottom: 10px;
   }
footer .footer_info {
   padding: 10px 0;
   margin: 10px 0;
   text-align: center;
   border: 1px solid #333;
   }

in firebug, its simply a matter of getting rid of the PNG reference as I have done here, but it doesn't seem to be overiding the parent theme. Any ideas?

Pilens · « **Reply #15 on:** April 08, 2013, 23:16 »

You just deleted the "background-image:" lines, which means the background images of the parent theme are still there. Try replacing those lines in your child styles.css with e.g. "background-image: url("");"

THP Creative · « **Reply #16 on:** April 08, 2013, 23:38 »

I'm such an idiot

thanks pilens, that makes a lot of sense.

Will try it now

THP Creative · « **Reply #17 on:** April 09, 2013, 00:21 »

ok, so that worked great, i know understand a little more CSS!

But I cannot for the life of me work out how to remove the boxes in the footer. I don't want the borders.

None of the css footer classes seem to relate to the boxes?

Travelling-light · « **Reply #18 on:** April 09, 2013, 01:22 »

Quote from: Microstock Man on April 09, 2013, 00:21

ok, so that worked great, i know understand a little more CSS!

But I cannot for the life of me work out how to remove the boxes in the footer. I don't want the borders.

None of the css footer classes seem to relate to the boxes?

The .footer_section classes control the three boxes, and the .footer_info is the full width one below. I just changed the border colour via the child style.css to check. Look at http://photo.travelling-light.net to see the red borders.

Pilens · « **Reply #19 on:** April 09, 2013, 02:27 »

Quote from: Microstock Man on April 09, 2013, 00:21

ok, so that worked great, i know understand a little more CSS!

But I cannot for the life of me work out how to remove the boxes in the footer. I don't want the borders.

None of the css footer classes seem to relate to the boxes?

I guess I succeeded in getting rid of those boxes. I copied footer.php to my child theme and modified it like that:

<?php
/**
* The template for displaying the footer.
*
* Contains the closing of the id=main div and all content after
*
* @package symbiostock
* @since symbiostock 1.0
*/
?>
</div>
</div>

<footer id="colophon" class="site-footer" role="contentinfo">
<div class="footer_info">
<p class="muted">
Copyright © 2013 www.imagoborealis.com, All Rights Reserved
<span class="sep"> | </span>
<a rel="generator" title="A Semantic Personal Publishing Platform" href="http://wordpress.org/">Proudly powered by WordPress[/url]
<span class="sep"> | </span>
Theme: SYMBIOSTOCK by
<a rel="designer" href="http://www.clipartillustration.com/">Leo Blanchette[/url]
</p>
</div>
</footer>
<?php include_once('modal-login.php'); ?>
<?php wp_footer(); ?>
</body>
</html>

You can see on my site what this (and some minor tweaking in styles.css) did. BUT I don't really know if this is going to haunt me later with some unwanted side effects. Try on your own risk

Leo Blanchette · « **Reply #20 on:** April 09, 2013, 02:44 »

Awesome job. Just make sure you don't remove <?php wp_footer(); ?> - that is very important. Your doing things the right way. Keep it up!

Kerioak~Christine · « **Reply #21 on:** April 09, 2013, 02:45 »

It does have a VERY unwanted side effect (when I tried it and it seems to be the same on your site) - try logging out of your site then logging in from the Login/Register link at the top of the page.

Putting an edited footer in the child theme caused the problems I posted about here http://www.microstockgroup.com/symbiostock-technical-support/i%27ve-broken-it-loginregister-option-at-top-goes-to-eula-i-think/ - the way I did it anyway

THP Creative · « **Reply #22 on:** April 09, 2013, 03:17 »

Got it, following code in child theme style.css works, no noticable quirks...

footer.site-footer {
   background-color: #5E5E5E;
   background-image: url("");
   padding: 20px 20px;
   color: #CCC;
   border-style:none;
   }
footer .footer_section{
   background-image: url("");
   padding: 10px;
   border: none;
   margin-bottom: 10px;
}

footer .footer_info {
   background-image: url("");
   padding: 10px 0;
   margin: 10px 0;
   text-align: center;
   border: none;
   }

YAY! Now just need some fine tuning of a few things...

Pilens · « **Reply #23 on:** April 09, 2013, 04:29 »

Quote from: Tinny on April 09, 2013, 02:45

It does have a VERY unwanted side effect (when I tried it and it seems to be the same on your site) - try logging out of your site then logging in from the Login/Register link at the top of the page.

Putting an edited footer in the child theme caused the problems I posted about here http://www.microstockgroup.com/symbiostock-technical-support/i%27ve-broken-it-loginregister-option-at-top-goes-to-eula-i-think/ - the way I did it anyway

Thank you for pointing this out, Tinny. I somehow knew it couldn't be THAT easy.

edited: even an unedited copy of footer.php in the child theme has this effect.

Kerioak~Christine · « **Reply #24 on:** April 09, 2013, 06:29 »

Nice one Tim - I have done a variation now, had managed to change some of the text colour and now added a picture to the footer, not sure if it works but carries on from kerioak.com site background to a certain extent

cathyslife · « **Reply #25 on:** April 09, 2013, 06:35 »

Quote from: Microstock Man on April 09, 2013, 03:17

Got it, following code in child theme style.css works, no noticable quirks...

footer.site-footer {
background-color: #5E5E5E;
background-image: url("");
padding: 20px 20px;
color: #CCC;
border-style:none;
}
footer .footer_section{
background-image: url("");
padding: 10px;
border: none;
margin-bottom: 10px;
}

footer .footer_info {
background-image: url("");
padding: 10px 0;
margin: 10px 0;
text-align: center;
border: none;
}

YAY! Now just need some fine tuning of a few things...

Yep, you did what i did...

klsbear · « **Reply #26 on:** July 04, 2013, 18:13 »

I managed to change the background color of the footer but I can't figure out how to change the text color of the "Information" text and links below (they are in a text widget) and also the grey copyright info in the footer.

Can anyone point me in the right direction to change the font colors here?

Redneck · « **Reply #27 on:** July 05, 2013, 09:13 »

Quote from: klsbear on July 04, 2013, 18:13

I managed to change the background color of the footer but I can't figure out how to change the text color of the "Information" text and links below (they are in a text widget) and also the grey copyright info in the footer.

Can anyone point me in the right direction to change the font colors here?

If I'm correct the footer info font is defined by the CSS class "muted".
Just paste this code into your child theme CSS to change color or other attributes to your liking. This is an example for making the font red.

Code: [Select]

/*Footer Info Text*/

	.muted {
	color: #FF0000;
	}

klsbear · « **Reply #28 on:** July 05, 2013, 20:44 »

Quote from: Redneck on July 05, 2013, 09:13

Quote from: klsbear on July 04, 2013, 18:13
I managed to change the background color of the footer but I can't figure out how to change the text color of the "Information" text and links below (they are in a text widget) and also the grey copyright info in the footer.

Can anyone point me in the right direction to change the font colors here?

If I'm correct the footer info font is defined by the CSS class "muted".
Just paste this code into your child theme CSS to change color or other attributes to your liking. This is an example for making the font red.

Code: [Select]
/*Footer Info Text*/ .muted { color: #FF0000; }

Thank you! That worked on the copyright info but for the life of me I can't track down where you found that as I couldn't find it on the styles.php sheet (I've been searching there for code to copy and change colors) It still doesn't solve the problem of the colors on the widget text in the footer so I'm still searching for that solution.

Pilens · « **Reply #29 on:** July 05, 2013, 21:11 »

If you use Firefox just get a plugin like Firebug. You click (right) on some object on a web site and get all the styles that apply including class names etc. It is a BIG help.

klsbear · « **Reply #30 on:** July 05, 2013, 22:02 »

Quote from: Pilens on July 05, 2013, 21:11

If you use Firefox just get a plugin like Firebug. You click (right) on some object on a web site and get all the styles that apply including class names etc. It is a BIG help.

Thanks! I do use Firefox and did get Firebug but since I've had absolutely no training on CSS or any other web programming I'm just using logic to figure out changes. The "right click" clue helped - I clicked on the footer copyright info and see where the .muted came from so now I can start searching out other areas I want to change (carefully of course, on the child theme only!)

Redneck · « **Reply #31 on:** July 05, 2013, 22:06 »

Just take a look at the source code of your page and find which CSS class is pulled to format the text. Then overwrite this CSS class with the parameters you like by putting it into your child theme CSS.

If this doesn't solve the problem then let me know the URL of your site.

klsbear · « **Reply #32 on:** July 05, 2013, 23:01 »

Quote from: Redneck on July 05, 2013, 22:06

Just take a look at the source code of your page and find which CSS class is pulled to format the text. Then overwrite this CSS class with the parameters you like by putting it into your child theme CSS.

If this doesn't solve the problem then let me know the URL of your site.

Thanks! My site url is www.karensarragaphotography.com. The part I'm struggling with right now is the "Information" title in the text widget on the lower left. I was able to change the font color in the links below but I think the "Information" header is pulling from the color used for the h1, h2, h3 headers as a default. Not sure how to change the individual headers, if that's possible. I wanted it to be darker, or stand out with an underline or something that would separate it from the links.

Pilens · « **Reply #33 on:** July 05, 2013, 23:56 »

When I use Firebug on the "Information" headline I find

Code: [Select]

footer .footer_section {

...

}

should do the trick. I also see you have that already in your child theme styles.css. So just add some text formatting of your choice and you should be set.

I can't remember exactly why (and if that was necessary for some reason) but I have used the following code to format that text:

Code: [Select]

div.footer_section.span4 {
...
}

You are welcome to use your Firebug on my site. I got all sorts of css tweaks. And I am definitely no expert, I was just "firebugging" away...

Redneck · « **Reply #34 on:** July 06, 2013, 07:38 »

Karen, it seems to me you have used a simple text widget without giving any format information to get this menu block into your site.
Do you mind sending me the widget text by PM so I can adjust it?

Or you could also use the Menu widget with a menu you've created before. The Menu widget has already formatting included.

steheap · « **Reply #35 on:** July 06, 2013, 08:33 »

Slightly more complex CSS question. I'm running Amanda's clean theme, and on the image display/purchase screen, my descriptions of the image run straight into the author's picture and bio - with no spaces unless I force a "non breaking space" into each description of each image. As I didn't do this for the first 600 images, this is a hassle!

I would like to add a bit of padding either underneath the description display on the image page, or at the top of the author bio segment so that there is a space between the two. I can see the various Class IDs when I look at the source code, but not sure how to modify one of those to add a bit of space.

Ideas?

Steve

Redneck · « **Reply #36 on:** July 06, 2013, 09:38 »

Quote from: steheap on July 06, 2013, 08:33

Slightly more complex CSS question. I'm running Amanda's clean theme, and on the image display/purchase screen, my descriptions of the image run straight into the author's picture and bio - with no spaces unless I force a "non breaking space" into each description of each image. As I didn't do this for the first 600 images, this is a hassle!

I would like to add a bit of padding either underneath the description display on the image page, or at the top of the author bio segment so that there is a space between the two. I can see the various Class IDs when I look at the source code, but not sure how to modify one of those to add a bit of space.

Ideas?

Steve

Try this. (Add it to your child theme CSS)

Code: [Select]

/*Padding Image Page Author Bio*/

.author-bio {
	padding-top: 20px;
	}

steheap · « **Reply #37 on:** July 06, 2013, 10:17 »

Yes, that did the trick - thanks very much!!

Steve

Amanda_K · « **Reply #38 on:** July 07, 2013, 17:07 »

Thank you, I'm going to make that adjustment for the update of Cleantheme, was just waiting a bit for the dust to settle on the main theme since I had one or two new elements to style. I'll be sending out the updated version this week!

steheap · « **Reply #39 on:** July 07, 2013, 18:18 »

Great - can you look at the formating of that page that you come to from the registration email at the same time. The layout between the "sign in" and the "registration" part of that screen is pretty messed up (at least on Chrome)

Steve

quailrunphoto · « **Reply #40 on:** July 07, 2013, 18:41 »

Quote from: Amanda_K on July 07, 2013, 17:07

Thank you, I'm going to make that adjustment for the update of Cleantheme, was just waiting a bit for the dust to settle on the main theme since I had one or two new elements to style. I'll be sending out the updated version this week!

I look forward to seeing the new version. How will you notify the Symbiostock members that it is available?

David

cathyslife · « **Reply #41 on:** July 10, 2013, 18:18 »

Quote from: steheap on July 07, 2013, 18:18

Great - can you look at the formating of that page that you come to from the registration email at the same time. The layout between the "sign in" and the "registration" part of that screen is pretty messed up (at least on Chrome)

Steve

I just did a test registration because I installed AntiCaptcha, and when I was directed to the Thank You page, it is pretty messed up. It has not been like that in previous test registrations I have done. I am going to go see if I can correct it with CSS but wanted to give a heads up.

edit: yeah, I didn't see what CSS might control that. Any clues?

Amanda_K · « **Reply #42 on:** July 10, 2013, 18:46 »

I'm actually just finishing the last change on version 2.0 to be released tomorrow. Cathy, I'll email it to you test out. I have fixed this page specifically.

Edit: Emailed it out to you Cathy, let me know if you have any issues. I'll be sending out the update tonight to everyone who purchased so far, and I have a change log and updated demo as well to post in the morning.

cathyslife · « **Reply #43 on:** July 10, 2013, 20:38 »

Quote from: Amanda_K on July 10, 2013, 18:46

I'm actually just finishing the last change on version 2.0 to be released tomorrow. Cathy, I'll email it to you test out. I have fixed this page specifically.

Edit: Emailed it out to you Cathy, let me know if you have any issues. I'll be sending out the update tonight to everyone who purchased so far, and I have a change log and updated demo as well to post in the morning.

Thanks Amanda. I will check it out tomorrow.

MicrostockGroup Sponsors

Author Topic: Child Theme questions (Read 10142 times)

Leo Blanchette

Leo Blanchette

Leo Blanchette

quailrunphoto

Related Topics

Sponsors

Microstock Poll Results

Sponsors