How to use your own widget icon in the WordPress Widget customizer

Customize WordPress Widget IconIn developing deeper integration with the Customizer functionality of WordPress, I wanted to use a custom icon for my IDX+ plugin’s widgets.

By default, WordPress defines a list of icons using their dashicons icon set and tries to guess the best icon for your widget based on the CSS class of your widget.

Check out the CSS in customize-widgets.css starting on line 415.

For instance, if your widget’s CSS class contains “music”, “radio”, or “audio”, you will have the format-audio dashicon applied to your widget.

How to change the widget icon

Using Dashicons

Note: In order to choose a new icon, go to the Dashicons website and click on the icon you want to use, then click on the “Copy CSS” link to get the correct CSS content value.

#available-widgets [class*=YOUR_CSS_BASE] .widget-title:before{
    content: "\f217"; /* <-- replace this value */
}

Using your own icon font

#available-widgets [class*=YOUR_CSS_BASE] .widget-title:before{
    font-family: idx-plus!important; /* <-- replace this value */
    content: 'd'; /* <-- replace this value */
}

If you want the icon to change color when it’s hovered over, use the following code:

#available-widgets [class*=YOUR_CSS_BASE]:hover .widget-title:before{
    color: #7da838!important; /* <-- replace this value */
}

I hope this helps!

Introducing IDX+, WordPress Real Estate & IDX Done Right

I’m happy to release IDX+, the best WordPress IDX solution.

Enhance dsIDXpressIDX+ is a project I’ve been working on for months. It was born came out of necessity: a client told me “there is no perfect solution for WordPress real estate websites.” After looking into it, I realized he was right.

IDX+ is the solution to your real estate website’s problems. Continue reading “Introducing IDX+, WordPress Real Estate & IDX Done Right”

WordPress Real Estate Plugin: Stay Tuned…

You may have noticed this blog has gone un-updated. That’s because I’ve been working on an awesome new plugin.

WordPress + Real Estate + User Data + SEO

In the past, I’ve written posts about how to optimize your WordPress real estate website for SEO and I’ve created a Trulia plugin for WordPress.

This WordPress real estate plugin changes the game of what you can do with your WordPress website — and for how much money. No longer do you need to pay tens of thousands of dollars for an indexed IDX solution.

Next week I will release a beta version, so stay tuned for the formal announcement.