WordPress.org

Ready to get started?Download WordPress

Forums

Parament
[resolved] [closed] Borderless Parament Widgets (8 posts)

  1. User9999
    Member
    Posted 1 year ago #

    Hello,

    I don't know css but what I want I think would be simple for someone who does.
    My WordPress theme (Parament) creates borders for Widgets. So anything I place in a widget (such as in image) will be framed by a border.

    Can I remove the border from a particular instance of a widget?

    I want to be able to remove the border from some of my sidebar widgets but not from all widgets in my theme.

    What CSS code is needed to remove the border from whatever Widget I apply it to? And where do I paste this code?

    Do I need a child theme?
    Can I hardcode this change if I only need it for one Widget?

    I'm sorry to ask for so much! :P But TIA!

    *By the way, I love Parament! I have look at many Premium themes and found none that I like better!!

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Link to your site is necessary for help with CSS.

  3. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Which widget? If you don't have Custom CSS, you can add it by using a plugin like Custom CSS Manager.

  4. User9999
    Member
    Posted 1 year ago #

    I've been trying to get the default 'text widget' and 'Image (Jetpack)' Widget to be borderless in the wordpress Parament theme.

    From my incomplete site at http://retromegabit.com/ you can see an image of a cartoon guy. This is one Widget that I would like to be able to remove the Bordre from.

    I also have an adsense add in my side bar that I would like to make borderless too.

    I've looked at 'Widget CSS Classes' but there isn't enough detail on how to use it for a noob like me.

    Thank you very much for taking the time to reply to my posts! I really do appreciate it!

  5. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Hi again,
    So each widget does have a specific class and you can use that to target CSS to only that widget. A browser tool like Firebug will help you find the class you need to use. For example, the first widget (with the cartoon guy) has this HTML:

    <li id="image-5" class="widget-1 widget-first widget-odd Borderless Widget widget widget_image">

    So you can use widget-1 in CSS like so:

    .widget-1 {
        background: none;
        border: none;
        border-radius: none;
        box-shadow: none;
    }

    For the adsense, it's:

    <li id="adswidget1-quick-adsense" class="widget-3 widget-odd widget �lambda_6">

    So then you can add that class also to the above and you end up with this:

    .widget-1, .widget-3 {
        background: none;
        border: none;
        border-radius: none;
        box-shadow: none;
    }

    Since you are using JetPack, you can use the the custom CSS under Appearance > Edit CSS - just copy the above code into that space.

  6. User9999
    Member
    Posted 1 year ago #

    WPyogi! You're a genius!
    I followed your instructions and used your code and now I have borderless widgets for specific widgets.
    Thank you very much for you excellent help and very fast replies!

    I even used Firebug so that I'll be able to identify the class of a widget for the next time I need to do this.

    Thank you!

  7. bderksen
    Member
    Posted 7 months ago #

    I want to add a links widget to my side bar. Where do I get it?

  8. bderksen - could you please start a fresh thread in the plugins forum for your new question?

    http://wordpress.org/support/forum/plugins-and-hacks

    I'm closing this one since it's been resolved long ago.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic