Shortcode Styling

Hi @ssmeredith,

I appreciate that you’re helping us to migrate over (…)

Thanks, that’s very kind of you!

What is the best way to add your widget styling to the shortcode?

Alright, so this is the shortcode version of the “Cards” themed popular posts list:

[wpp range='last24hours' limit=5 excerpt_length=75 thumbnail_width=75 thumbnail_height=75 stats_views=0 stats_category=1 wpp_start='<ul class="wpp-list wpp-cards">' post_html='<li class="{current_class}">{thumb_img} <div class="wpp-item-data"><div class="taxonomies">{taxonomy}</div>{title} <p class="wpp-excerpt">{excerpt}</p></div></li>' wpp_end='</ul>']

The only thing you may need/want to change is the range parameter. I set it to “last24hours” since I don’t know which Time Range you’re using with the classic widget ?? Possible values for the range parameters are last24hours, last7days, last30days, all, and custom (see Parameters for more details).

It seems you already know how to add the shortcode to your sidebar but in case you don’t:

1. Add a Text widget to your sidebar (via Appearance > Widgets > [Your Sidebar Name]).
2. Set Text widget’s title to “Trending” (or whatever you want haha)
3. Paste the shortcode inside the Text widget.
4. Save changes.

You will also need to add these CSS rules to your site for the shortcode to be styled accordingly. You can do so either via WP Dashboard > Appearance > Customize > Additional CSS or by including these into your current WordPress theme’s style.css file.

If you have any further questions don’t hesitate to ask, alright?

Excellent help! Thanks very much! ??

Hi there!

Quick question. Using this short code, can I single out a specific category? For example, if I wanted to use to category “news” what would that look like in the shortcode?

TIA!

Hey @ssmeredith,

For that you can use the cat parameter to ask the shortcode to list only popular entries from a specific category ID.

For example let’s say that the ID of your news category is 65, (how to find the category ID) then:

[wpp range='last24hours' limit=5 cat=65 excerpt_length=75 thumbnail_width=75 thumbnail_height=75 stats_views=0 stats_category=1 wpp_start='<ul class="wpp-list wpp-cards">' post_html='<li class="{current_class}">{thumb_img} <div class="wpp-item-data"><div class="taxonomies">{taxonomy}</div>{title} <p class="wpp-excerpt">{excerpt}</p></div></li>' wpp_end='</ul>'