x

Different HTML/CSS classes

Hi,

Is it possible to add the different classes to different items on the page?

For example I use two different text elements on one page, I want to add (in CSS) the background color to one of them, but they both have the same "class="

How can I identify the rules for only one of them?

Thank you.

5,815 Views
Message 1 of 4
Report
3 REPLIES 3

Hi, @Keep!

Although someone else may be able to give more thorough advice, I know that there are ways that you can do this. For example, you can look to see if the parent class is different. You can also count the elements and target a specific index.

Thanks,

Erin

Weebly Community Manager

5,799 Views
Message 2 of 4
Report

Hi there! This is very easy to do if you use the Embed Code element. While adding text using the Embed Code element my not look as pretty at first, it's very easy to customize in the way you're asking.

I believe the default for most themes is something like this:

<div class="paragraph">Your text.</div>

Inserting that into a Embed Code element will create text that looks like just like the text element that is normally used. To create a new style, just use a different class name like this:

<div class="styledParagraph">Some other text.</div>

After that you just need to decide how you want it to look and insert your own custom CSS for the "styledParagraph" class. A good place to start would be to copy and paste the Weebly default "paragraph" (or whichever your theme named it) and alter it as you see fit.

Hope that helps!

5,793 Views
Message 3 of 4
Report

You can add custom HTML code and do anything you want. However, be aware that Weebly will automatically close any tag you open.

So it won't work, for example to have:

custom tag: <div id=mycustomid>

Weebly module

custom tag: </div>

Weebly just adds the </div> after the first custom tag and the Weebly module remains unaffected.

My particular problem is that I have a dark section on the home page and the links don't show up. So I need to change the link color from the default.

What I've ended up doing is redefining the underline tag so that any links that are underlined are light-colored.

1,686 Views
Message 4 of 4
Report