[ricewottonParticipant]

Hi Guys,

I would like to add div id = customdivID to my custom CSS one my home page ONLY, not entire page, how do add in the css?

Thanks.

[MrinalMember]

Hi Rice,

For home page, follow the example:

.home .class {
  css: property;
}

For other pages, find the page ID first from the address bar of the browser:

or from page source (Key: CTRL+U/CMD+U):

The add CSS as like the following:

.page-id-3037 .class {
  css: property;
}

Hope this helps, Cheers!

[ricewottonParticipant]

.home .class {
css: property;
}

Qns1)
So if I wish put to an div id=”backtotop” on the body container , my own custom /#top instead of the default. How do I do that?

Qns2) by assign an ID to body container, if i hashtag call the ID, it will go to the top, like /#top, right?

[ricewottonParticipant]

it would be great if you answer like 1) xxx, 2) xxx so its easier to follow! thanks 🙂

[ricewottonParticipant]

I’m referring to this, https://www.dropbox.com/s/7pmczer7rqs2c9f/custom%20css-homepage.png just in case there is some wrong assumption.

[ChristianModerator]

Hey Rice,

1. You cannot add an ID to the body and can’t use the ID #top because it is already applied to the main site container.

2. Yes, you’re correct.

Can you give us more details on what you’re trying to achieve for us to determine if there is a solution?

Thanks.

[ricewottonParticipant]

Okay I’m aware of it.

But I would like to assign my own custom ID like #customID to the main body container, please you let me know how to do it? the entire body container is assign to an #customID, like #middlebody1, #service etc.

.home .class {
  css: property;
}

[ChristianModerator]

Please modify _header.php located in wp-content\themes\x\framework\views\global. If you’re using a child theme, copy the modified file in the same directory in your child theme’s folder.

Thanks.

[dotcomdesigngrouopParticipant]

Can you please tell me what I did incorrectly?

Code added to style.css of child theme:

.page-id-1428 .class .entry-wrap {
  background-color: #ffffff;
}

(page: https://www.funnydummy.com/motivational-speaker/ )

Thank you!

[ThaiModerator]

Hi @dotcomdesigngrouop,

You don’t need to include .class to the CSS code, the correct CSS code should be:

.page-id-1428 .entry-wrap {
  background-color: #ffffff;
}

Hope it helps.

[kristianlParticipant]

Hi there,

I’m trying to add a CSS style through the Customiser to 1 page but I can’t get it to limit to the one page.

I want to add the following styles to only the News (Blog) page (who’s page id=13). It works without the “.page-id-13” part but applies it to the whole site, then doesn’t work when I add the page id part.

.page-id-13 .x-main.full {
    padding-left: 45px;
    padding-right: 45px;
    padding-top: 45px;
    padding-bottom: 45px;
    background-color: white;
}

Is there anything wrong with the code that you can see?

[Paul RModerator]

Hi,

Thanks for writing in!

Your code is correct but you might have added the wrong page id.

You can try this instead.

.blog .x-main.full {
    padding-left: 45px;
    padding-right: 45px;
    padding-top: 45px;
    padding-bottom: 45px;
    background-color: white;
}

If that doesn’t help, please provide us with your site url so we could take a closer look.

Thanks

[kristianlParticipant]

PERFECT!

Thank you so much – X Theme just keeps exceeding my expectations.

[Rue NelModerator]

Hello There,

You’re most welcome! We are just glad we were able to help you out.
And thanks for letting us know that it has worked for you.

Have a great day.

[Author]

Posts