Child Theme CSS Header Text Troubles

Graphene Theme Forum » Graphene Wordpress theme » Support

Child Theme CSS Header Text Troubles

(10 posts) (3 voices)

Started 2 months ago by qtmcdowell
Latest reply from qtmcdowell
This topic is closed
This topic is resolved

Skip to the latest post | RSS feed for this topic

qtmcdowell
Member
I have been attempting to edit my Child Theme to format my Header Text using a google font...but the changes are not showing up on my website.

Also, when I edit text color in the Graphene Theme, those changes disappear whenever I deactivate Graphene and activate my Child Theme, am I doing something wrong?

Here is my CSS code in my child theme. Website: http://www.aretehoops.com
```
@import url(http://fonts.googleapis.com/css?family=IM+Fell+DW+Pica);

#header{
font-family: 'IM Fell DW Pica',
serif; font-weight: 400; text-decoration:underline;
font-size: 80px; color:#CB0000
}
```
Posted 2 months ago #
Luko
Member
I assume that by "Header Text" you mean Title and Description.
Instead of #header ID try with .header_title and .header_desc style class. Like this:
```
.header_title, .header_desc  {
font-family: 'IM Fell DW Pica',
serif; font-weight: 400; text-decoration:underline;
font-size: 80px; color:#CB0000
}
```
You don't have to use child theme for importing google fonts. It can all be done (including header text styling) through Graphene Options/Display/Text style options
Posted 2 months ago #
Prasanna SP
Moderator

Put code in between backtick (`) characters. It's usually located above the Tab key on your keyboard.

Personal Website prasannasp.net | WordPress Plugins developed by me.
Graphene Child Theme Template | Graphene Theme Tutorials | WordPress tutorials.

Posted 2 months ago #
qtmcdowell
Member
I got the title description to work using....
```
.header_desc  {
font-family: 'IM Fell DW Pica',
serif; font-weight: 400; text-decoration:underline;
font-size: 40px; color:#CB0000
}
```
but when I try to change the header title using....
```
.header_title. {
font-family: 'IM Fell DW Pica',
serif; font-weight: 400; text-decoration:underline;
font-size: 80px; color:#CB0000
}
```
then nothing happened.

Also, I have experimented using google fonts in the graphene options/display/text style options, but was not sure if my changes would be saved if I install the next update, or if my website crashes and I have to use backed up files... Any suggestions on that?

Thanks.
Posted 2 months ago #
Prasanna SP
Moderator
There should be no dot . after .header_title. Try this,
```
.header_title {
font-family: 'IM Fell DW Pica',
serif; font-weight: 400; text-decoration:underline;
font-size: 80px; color:#CB0000
}
```
..but was not sure if my changes would be saved if I install the next update,..

The modifications you've done through Graphene Options is saved in the database. So, you don't have to worry about losing modifications upon doing an update. But if you have theme files, you're modifications will be overwritten when you update the theme.

Personal Website prasannasp.net | WordPress Plugins developed by me.
Graphene Child Theme Template | Graphene Theme Tutorials | WordPress tutorials.
Posted 2 months ago #
qtmcdowell
Member

The title changed color but did not adopt any of the other changes...

Also when should I always have my child theme activated when making changes to the website, because whenever I switch from the parent theme to my child theme, there are certain modifications that don't transfer between the two.

Thanks for the help.

Posted 2 months ago #
Prasanna SP
Moderator
..The title changed color but did not adopt any of the other changes...

Try adding !important to style declaration.

Example,
```
.header_title {
	font-family: 'IM Fell DW Pica',serif !important;
	font-weight: 400 !important;
	text-decoration: underline !important;
	font-size: 80px !important;
	color: #CB0000 !important;
}
```
Personal Website prasannasp.net | WordPress Plugins developed by me.
Graphene Child Theme Template | Graphene Theme Tutorials | WordPress tutorials.
Posted 2 months ago #
qtmcdowell
Member

Perfect. That worked.

Thanks for the help.

Posted 2 months ago #
Luko
Member

Once you switch to child-theme. leave it. Only if you have to test something, then activate main theme. When you're adding something in Graphene Options you don't need to switch the theme.
Try this:
1.Go to Graphene Options/Display/Text Style Options/, under google web fonts/ font families add this: IM+Fell+DW+Pica
2. Under same panel, in Header text, on Title text front add: IM Fell DW Pica
3. Under title text size add: 80px... same thing for description.

After that delete the code in Child theme style.css. It's always better to do modifications through Graphene Options and leave Child theme for things you can't tweak through Graphene Options.

Posted 2 months ago #
qtmcdowell
Member

Luko,

That worked well, thanks for clearing up some of my confusion with this.

Cheers.

Posted 2 months ago #

Topic Closed

This topic has been closed to new replies.