Changes on my site-CSS

  • Unknown's avatar
    inlantapewaukee · Member ·

    Hi there,

    My website is inlantapewaukee.com and my theme is Oxygen. I chatted with a support person and they referred me here to talk to a CSS expert.

    My question is, am i able to change certain settings on the front page slider? I would like to remove the date that shows below the title and also if possible, remove the thumbnails that appear below in order to just have the slider page.

    Please let me know, thank you!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    classicsuper · Member ·

    Hi inlantapewaukee,

    I’m no CSS “expert” yet :) but maybe I can point you to the right documentation to help you edit your CSS. Check out this Support article on customizing your CSS:

    https://en.support.wordpress.com/getting-help-in-the-forums/#how-do-i-get-a-moderatorstaff-reply-for-my-question

    FYI, I’m pretty sure you need to have either a WordPress.com Premium or WordPress.com Business plan to be able to edit CSS. You may already have this though :)

    If you are still having trouble after following the instructions in the Support article, you may wish to have a mod check out your issue. To do this, you will need to follow the instructions here (so that they can see this post):

    https://en.support.wordpress.com/getting-help-in-the-forums/#how-do-i-get-a-moderatorstaff-reply-for-my-question

    In any case, I suppose that if the tool is enalbed for you, it should be pretty straight forward to see the CSS and hopefully to locate the attribute/tags pertaining to what you wish to remove from your site.

    I hope this helps, cheers!

  • Unknown's avatar
    inlantapewaukee · Member ·

    Thank you very much nerdepic!

    I was able to remove the date posting on the slider but am still unable to find in any forum/anywhere the CSS for removing the thumbnails below the featured images. I feel that I don’t need both the featured image and the thumbnail underneath. Do you know anyone who can help me with this CSS?

    I saw a forum with TheSacredPath commenting different CSS to remove things from the website

  • Unknown's avatar
    timethief · Member ·

    Please be aware that Staff do provide support for all CSS editing threads posted into this CSS forum and no tagging threads with modlook is required.

  • Unknown's avatar
    inlantapewaukee · Member ·

    I’m not sure what you’re talking about. Every thread I’ve seen that involves what I need to discuss is closed

  • Unknown's avatar
    timethief · Member ·

    Hi again,
    Staff will automatically provide support for every CSS thread that has not been closed in this queue https://en.forums.wordpress.com/forum/css-customization. They will do so in order of the datestamps on the threads were created on. They work their way forward through the threads tagged with the earliest dates to those with the most recent date.

  • Unknown's avatar
    inlantapewaukee · Member ·

    Ok thank you very much! I posted this in another forum as well.

    “I would like to get rid of the thumbnails that are below the featured slider. Is there a CSS code to do this?

    Also is there a way to get rid of some of the sidebar action when I click into pages like “contact” and such. It’s a little cluttered having everything from the homepage everywhere.

    Please let me know, thanks!”

  • Unknown's avatar
    inlantapewaukee · Member ·

    I would also like to center my menu, make it a little larger if possible and uppercase lettering?

  • Unknown's avatar
    classicsuper · Member ·

    Hey inlantapewaukee,

    If you still need help with this I think I got something for you :)

    Beofore anything, I highly encourage you to check out this support article which basically enabled me to accomplish all of this:

    https://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/

    I was able to remove the thumbnails below the feature slider by simply setting the with to 0%. You can paste the following code to your CSS and I think it will do the trick for you:

    /*this code removes the tumbnails from the slider-nav*/
#slider-nav {
    width: 0%;
}

    To center the main menu, I set the margin-left property at 50%. I am absolutely sure that there is a more elegant way of doing this but this is the only way I got it to work for now. Just add this to you CSS:

    /*main menu center*/
.main-navigation ul {
    margin-left: 50%;
}

    To set the main menu to all CAPS:

    /*main menu uppercase*/
.main-navigation a {
    text-transform: uppercase;
}

    Finally (you may not want/need this), but if you want to remove the arrows from the bottom left and right side of the feature images in the slider, use the following code. Of course, if you do this there is no way to move across the images since the thumbnails will no longer appear. 

    /*This code removes the slider nav arrows if you want*/
.slider-nav {
    height: 0px;
}

    Regarding the following, I’m not sure I follow but if you care to elaborate and provide an example, I may be able to help you out.

    Also is there a way to get rid of some of the sidebar action when I click into pages like “contact” and such. It’s a little cluttered having everything from the homepage everywhere.

    Cheers!

  • Unknown's avatar
    inlantapewaukee · Member ·

    Wow thank you so much nerdepic you were a huge help!! In regards to the last part, what I meant was: when you click into an actual page on my site (“contact” for example) everything on the sidebar widgets shows up making the page a little cluttered. Is there anyway in the page settings to hide the primary or secondary sidebars? Please let me know if this was more clear!

    THANK YOU! :)

  • Unknown's avatar
    thesacredpath · Member ·

    @inlantapewaukee, the following will remove the left and right sidebars from static pages such as your Contact and About Inlanta pages and take the content full width. 

    .page #secondary, #tertiary {
    display: none;
}
.page #content {
    margin-left: 0;
    margin-right: 0;
}
  • Unknown's avatar
    inlantapewaukee · Member ·

    Hi thesacredpath,

    Thank you for your help! This worked on some pages which made them look great, but did not work on others. For example, on my “blog” tab, it still had the left side menu but no right side and then it took away both menus from my home page. Do you know why this is? Please let me know, thank you!

  • Unknown's avatar
    thesacredpath · Member ·

    I targeted only static pages, not any pages related to posts since you indicated pages like “contact”. If you wish to apply this to your entire site, pages, posts etc., then try the following instead. 

    #secondary, #tertiary {
    display: none;
}
#content {
    margin-left: 0;
    margin-right: 0;
}
#content .featured-image img {
    width: 100%;
}
  • Unknown's avatar
    inlantapewaukee · Member ·

    Hi thesacredpath,

    I do not wish to apply this to my entire site. The first CSS text you gave me works perfectly but it messes with my Home page and blog page. I would like my home page to have all the menus/widgets on it especially (since it is the front page), i just would like it to be gone for the others. Does this make sense? Please let me know, thank you!

  • Unknown's avatar
    thesacredpath · Member ·

    Hmmm, this is going to be complicated with CSS. For your static pages such as about, our team, loans, etc., you can edit those pages and set them to the full-width page template in the attributes module (sorry I didn’t recommend that before). For your home page, you would leave it set to the default page template (with sidebars). Categories, blog, archives and your home page will still show the sidebars.

    If you want the single post pages, such as this one, to not have sidebars, we can do that with the following CSS. 

    .single #secondary, .single #tertiary {
    display: none;
}
.single #content {
    margin-left: 0;
    margin-right: 0;
}
.single #content .featured-image img {
    width: 100%;
}

    You will notice on single post pages that some of your images may not be full width of the content column. To fix this, edit the post and then click on the image and click the edit button and set the size to “full-width”.

  • The topic ‘Changes on my site-CSS’ is closed to new replies.