[highlandadventuresParticipant]

hi..sorry to bother you with this…i am trying to manage the format of some paragraph through customizer via the CSS window. I would like to crate a unique formating scheme (for example font size 24px) and be able to apply this to a few lines in my website. don’t want to have to change it at the page level (from 24px to 22px for example). I like to be able to manage this new formating id (or whatever we call it) from the CSS window….how can i do this. thanks for your help. c

[RupokMember]

Hi there,

Thanks for writing in! You can use a Text Element and set font-size on the Style field for the particular paragraph – http://prntscr.com/al543r

Let’s use different Text Element to extinct each other.

Hope this makes sense.

Cheers!

[highlandadventuresParticipant]

thank you for the reply. your solution is nice, but for a single item on a single page…we need to figure out something that we can name an apply to a paragraph used in many pages….so it would be nice to be able to midify the font sinze from the CSS customization window rather than managing that at each page. Hope this clarify the question.

[FriechModerator]

Hi There,

Before we proceed please read this post first on how STYLE, CLASS, and ID works.

Basically, what you need is to declare the desired styling first with a CLASS:

e.g.

.myclass1 {
	color: blue;
	font-size: 20px;
	font-weight: 400;
	font-style: italic;
}

.myclass2 {
	color: red;
	font-size: 24px;
	font-weight: 600;
}

.myclass3 {
	color: green;
	font-size: 30px;
	font-weight: 800;
}

And then apply the specific class for specific text element.

Hope it helps, Cheers!

[highlandadventuresParticipant]

thanks…how and where do you apply the specific class or id…i tried to type .myclass3 in the id box of a text elements…nothing happened…then i tried without the period “myclass3″…nothing happened. can you please let me know how to i activate the new class within a specific element. what specifically need to type and where. thanks. c

[FriechModerator]

Hi There,

Sorry for not being clear. You need to place the declared class on the Text element’s CLASS field.

Yes, without the period. You only need to put the period when declaring the class on Custom CSS on Customizer.

Hope it helps, Cheers!

[highlandadventuresParticipant]

thank you for your quick response. i tried that and it does NOT change the element. i typed:

.myclass {
font-color: red;
}

in the CSS, then myclass in the CLASS box of the element on the page….and no change of color. any thoughs?

[highlandadventuresParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

Oh sorry I forgot about the <p> tag. Text on the text element are wrap with <p> tags, so you need to update your CSS selector as .myclass p

And there is no font-color attribute, there is only color atttribute. Please update your class declaration to:

.myclass p {
 color: red;
}

Hope it helps, Cheers!

[highlandadventuresParticipant]

it worked…thanks

[highlandadventuresParticipant]

what would be the CSS class code to change the color background in a column. tks

[RupokMember]

Hi there,

Thanks for writing back. You can directly set background color if you select any column. Also you can set a class as above or directly set CSS to the Style field. Lot of choices, right? See – http://prntscr.com/am1sta

Hope this helps.

Cheers!

[highlandadventuresParticipant]

hi..thanks for the reply.

similar to my original question…i understand how to create a CSS class…your reply for a paragraph was clear

.myclass p {
color: red;
}

now for a column, we want to have control from CSS pannel for all columns background color. what would be the class…for example:

.sidebannercolumn {
color: red;
}

line in the mainclass example, do we need to add a letter (similar to the “p” added to myclass)? what is that letter.

we tried using the sidebannercolumn class into a column but it did not change the color to red. we inserted the class name into the class box of the column.

thanks,

[Rue NelModerator]

Hello Again,

To change the color of you column using a custom class which you may have added in the class box of the column settings, you can use your code because it is correct. The only problem is that maybe you have selected also background color in the column settings which will override your custom css. You may have to use !important in your code just like this:

.sidebannercolumn {
  color: red !important;
}

If you don’t mind, could please send us the url of the page you are trying to edit so that we can check how you set it up as well? Please let us know.

[highlandadventuresParticipant]

worked like a charm. thanks

[Author]

Posts