Title: Customizing twentytwelve sidebar elements
Last modified: August 22, 2016

---

# Customizing twentytwelve sidebar elements

 *  [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/)
 * Hi,
    I’m working on a custom template based on twentytwelve. I want to customize
   the list elements of the sidebar widgets, for example adding a fontawesome icon
   before the elements. I took a look at sidebar.php but it just sets the dynamic
   sidebar which is set in functions.php but nothing about coding and editing the
   list elements.
 * Which files should I edit to do that?
 * Thank you in advance!

Viewing 13 replies - 1 through 13 (of 13 total)

 *  [vtxyzzy](https://wordpress.org/support/users/vtxyzzy/)
 * (@vtxyzzy)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234013)
 * You can change the icon for the list elements using CSS.
 * Try adding the following to the end of your child theme’s style.css:
 *     ```
       .widget ul {
          list-style-image: url('sqpurple.gif');
       }
       ```
   
 * Replace sqpurple.gif with your icon file name.
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234045)
 * I thank you vtxyzzy but the problem isn’t the styling but to edit the side bar
   like adding an element or a paragraph or anything else near the sidebar voices.
   
   For example: a leaf before the list element
 *  [vtxyzzy](https://wordpress.org/support/users/vtxyzzy/)
 * (@vtxyzzy)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234049)
 * If you use a leaf icon in the CSS I gave you, it will add a leaf beside every
   element.
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234051)
 * I mean, adding even more HTML code or editing the PHP that generates list elements.
 *  [vtxyzzy](https://wordpress.org/support/users/vtxyzzy/)
 * (@vtxyzzy)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234052)
 * There are several widgets that will let you code PHP in the widget so you can
   make the content whatever you want.
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234054)
 * Ok, I really thank you for your kind suggestions but that’s not what I’m searching
   for.
    What I need is to know which are the files that calculate and generate 
   the sidebar or better: which files are used at the call of get_sidebar() function?
 * Thank you!
 *  [vtxyzzy](https://wordpress.org/support/users/vtxyzzy/)
 * (@vtxyzzy)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234055)
 * Have you looked at sidebar.php? (I am not at home right now so I can’t look to
   see if that is the correct file.) Some things may be controlled by code in WP
   core files.
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234056)
 * Yeah I checked it but it just runs this:
 *     ```
       <?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
       		<div id="secondary" class="widget-area" role="complementary">
       			<?php dynamic_sidebar( 'sidebar-1' ); ?>
       		</div><!-- #secondary -->
       	<?php endif; ?>
       ```
   
 *  [vtxyzzy](https://wordpress.org/support/users/vtxyzzy/)
 * (@vtxyzzy)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234059)
 * The function dynamic_sidebar() is in the core file wp-includes/widgets.php. You
   should not modify this file!!
 * You should stick to coding your own PHP in a widget.
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234072)
 * > The function dynamic_sidebar() is in the core file wp-includes/widgets.php.
   > You should not modify this file!!
   > You should stick to coding your own PHP in a widget.
 * Yes, I know….and we’re at the start of the topic again: what if I want to put
   PHP code or HTML before every list element???
 * Not styling the widget with CSS.
    Not putting HTML code in a single or different
   widget (so not a text-widget). Just putting new code before every widget LIST
   ELEMENT.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234073)
 * > Just putting new code **before **every widget LIST ELEMENT.
 * Just curious, what new HTML do you want to add before every `<li>`? Anything 
   other than an `<li>` will be invalid HTML.
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234074)
 * > what if I want to put PHP code or HTML before every list element???
 * you should be able to do this with modifying the `register_sidebar()` for your
   theme, or with existing actions or filters;
 * [http://codex.wordpress.org/Function_Reference/register_sidebar](http://codex.wordpress.org/Function_Reference/register_sidebar)
 * or by using filters for the default widgets outputs.
 * what exactly are you trying to add where to the output of the widgets?
 *  Thread Starter [lup0z](https://wordpress.org/support/users/lup0z/)
 * (@lup0z)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234076)
 * [@andrew](https://wordpress.org/support/users/andrew/) that’s obvious.
 * [@alchymyth](https://wordpress.org/support/users/alchymyth/) thank you but I 
   took a look at the WP API and it seems I can’t add code to list elements, just
   before or after the widget or the title.
    What I’m going to add this time is 
   a fontawesome icon so
 * `<i class="fa fa-icon"></i>`
 * but it will occur in the future for any different elements for sure

Viewing 13 replies - 1 through 13 (of 13 total)

The topic ‘Customizing twentytwelve sidebar elements’ is closed to new replies.

## Tags

 * [Coding](https://wordpress.org/support/topic-tag/coding/)
 * [elements](https://wordpress.org/support/topic-tag/elements/)
 * [list](https://wordpress.org/support/topic-tag/list/)
 * [sidebar](https://wordpress.org/support/topic-tag/sidebar/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 13 replies
 * 4 participants
 * Last reply from: [lup0z](https://wordpress.org/support/users/lup0z/)
 * Last activity: [11 years, 8 months ago](https://wordpress.org/support/topic/customizing-twentytwelve-sidebar-elements/#post-5234076)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics