WordPress.org

Ready to get started?Download WordPress

Forums

Can't find the CSS attribute for a widget to get rid of dots. (7 posts)

  1. bobcatou
    Member
    Posted 2 years ago #

    I think this has to do with widgets being given list attributes but I can’t find where it was put.
    http://www.listentothewind.com/temp/samplearrow.png
    If you look at the image above you can see the two dots I am talking.
    I’m redesigning theme for a client and I am working on the sidebar. Before it had a combination of a sidebar widget and html. I’m changing it to just a sidebar widget and the then I plan to just put the saved html in text widget boxes.
    The slider above in the sidebar is a widget and I am adding the title in the widget box.
    In the image below, I am using the widget text box but adding the title with h-tag in the text box and not in the title portion of the text box. (Note dot still shows above widget)
    This leads me to think it is a widget CSS issue over an H-tag issue.
    Examining it under developer tools in Chrome I find this <li id=”text-4″ class=”widget widget_text”> I don’t see a #li id in the style.css sheet
    I’ve actually deleted the entire style.css page and the dots remain so this has me puzzled at where this is coming from.
    I set up a test site here where you can examine the site live. http://www.listentothewind.com/hfl-redesign/ I have to say I am a little confused. I suspect it is something simple I am missing though.
    Thanks
    Bryan

  2. Jonas Grumby
    Member
    Posted 2 years ago #

    Seems like you have to add attributes to your CSS for #sidebar li

  3. bobcatou
    Member
    Posted 2 years ago #

    That did seem to help. I added the CSS below. List-style:none fixed it.

    #sidebar li {
    	margin: 0;
    	padding: 0;
    	list-style:none;

    }

    I also found this in the function.php file which might be my missing code. Note the "li id"

    <?php
    if ( function_exists('register_sidebar') )
        register_sidebar(array(
            'before_bar' => '<li id="%1$s" class="bar %2$s">',
            'after_bar' => '</li>',
            'before_title' => '<h2 class="sidebartitle">',
            'after_title' => '</h2>',
        ));
    ?>

    This is a free theme I got over 5 years ago. I don't know why they coded that way.
    I don't know why they did it that way. I'm thinking of just adding a new sidebar widget from scratch and getting rid of all this stuff.

    Thanks again

  4. Jonas Grumby
    Member
    Posted 2 years ago #

    I don't think that code is necessarily bad to have in there. You do have to register your sidebar(s) in functions.php or you won't be able to use widgets. That code is just to assign classes to the sidebar & sidebar title so you can style them with CSS.

  5. bobcatou
    Member
    Posted 2 years ago #

    Okay I think I see what you are saying. This is just another area to design widget areas. I don't get where the "bar %2$s" is though or is that php? I don't see it in the style.css file.

    'before_bar' => '<li id="%1$s" class="bar %2$s">',
            'after_bar' => '</li>',

    I see the code below that:

    ` 'before_title' => '<h2 class="sidebartitle">',
    'after_title' => '</h2>',`

    is telling the site to use the h2 class and whatever it assigned to the class id "sidebar title"

    I've done a few sites now but I myself am still a work in progress with this stuff.

    Thanks

  6. Jonas Grumby
    Member
    Posted 2 years ago #

    http://codex.wordpress.org/Widgets_API#Register_Single_Sidebar

    Yes that is so you can have CSS attributes for #sidebar li as well as separate attributes for the #sidebar li class or ID.

  7. bobcatou
    Member
    Posted 2 years ago #

    I get it. Thanks for the link Jonas

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags