Show Support Ribbon


Show support for your favorite cause, event, charity, political event, or anything else that’s awesome. Show Support Ribbon includes four built-in ribbon styles and makes it easy to customize with your own CSS.


  • Plug en play functionaliteit
  • Geen configuratie vereist
  • Regularly updated and “future proof”
  • Shortcode and template tag to display the ribbon anywhere
  • Limit display of the ribbon to any URL(s)
  • Choose one of four built-in ribbon styles
  • Customize the ribbon with your own CSS
  • Control the link text, link URL, and title text
  • Includes copy/paste CSS recipes to customize the ribbon
  • Includes option to restore default settings
  • Super-slick toggling settings page
  • Works with or without Gutenberg Block Editor


Choose one of the following ways to display your ribbon:

  • Badge
  • Banner
  • Lint
  • Verwijzing
  • Aangepast (elke tekst/HTML/CSS)

Much more is possible via the Custom option, which enables you to add your own CSS for custom styling.


This plugin does not collect or store any user data. It does not set any cookies, and it does not connect to any third-party locations. Thus, this plugin does not affect user privacy in any way.

Show Support Ribbon is developed and maintained by Jeff Starr, 15-year WordPress developer and book author.

Support development

I develop and maintain this free plugin with love for the WordPress community. To show support, you can make a donation or purchase one of my books:

And/or purchase one of my premium WordPress plugins:

Links, tweets and likes also appreciated. Thank you! 🙂


  • Show Support Ribbon: Plugin Settings (panels toggle open/closed)



  1. Upload the plugin to your blog and activate
  2. Visit the settings to configure your options

More info on installing WP plugins

Custom Markup

Note: For the “Custom” markup option, you can use the following shortcodes to display related information:

{{css_div}} = adds the CSS from the custom option, "CSS for <div>"
{{css_a}}   = adds the CSS from the custom option, "CSS for <a>"
{{url}}     = adds the URL from the option, "Link URL"
{{title}}   = adds the title from the option, "Link title"
{{text}}    = adds the text from the option, "Link text"


To upgrade Show Support Ribbon, remove the old version and replace with the new version. Or just click “Update” from the Plugins screen and let WordPress do it for you automatically.

Opmerking: het verwijderen van de plugin vanuit het WP plugins scherm resulteert in het verwijderen van alle instellingen uit de WP database.

Restore Default Options

To restore default plugin options, either uninstall/reinstall the plugin, or visit the plugin settings > Restore Default Options.

Aan het verwijderen

Show Support Ribbon cleans up after itself. All plugin settings will be removed from your database when the plugin is uninstalled via the Plugins screen.

Like the plugin?

If you like Show Support Ribbon, please take a moment to give a 5-star rating. It helps to keep development and support going strong. Thank you!


Where do I place the image for the button? How do I include a graphic for the button?

Images may be displayed using CSS. Upload the desired file and then display it using CSS, like so:

background-image { url(/path/to/image.png) fixed no-repeat center top; }

Fine-tune as needed to dial it in. To add via plugin settings, select “Custom” for the “Select your style” option and include for either <div> or <a> styles.

What is the Targeted Display option?

That setting enables you to limit the display of the ribbon to any specified URLs. So if you enter some URLs (separated by a comma), the plugin will display the ribbon only on those pages. Otherwise if no URLs are entered and the option is empty/blank, then the ribbon will be displayed on all pages on the site.

How to override inline custom styles?

First, you can customize any of the CSS/HTML for the “Custom” button option. For the other predefined options, you can override the default inline styles as follows:

To override the button’s outer <div> tag:

.show-support-ribbon[style] { font-size: 14px !important; }

To override the button’s inner <a> tag:

.show-support-ribbon a[style] { font-size: 14px !important; }

Then you can change the font-size to whatever properties are required.

How to make a plain-text badge with no link?

Select “Custom” for the option “Select your style”. Then replace the “Markup” option with the following code:

<div id="show-support-ribbon" class="show-support-ribbon" style="{{css_div}}">{{text}}</div>

Actually you can customize the markup however you want. And as explained in the Installation section of these docs, you can use {{css_div}} and other shortcodes to display related information from the plugin options. Or you can just skip the shortcodes and add whatever text/markup is required.

How to style the ribbon on mobile (small screens)?

This can be done with a CSS @media query. Here is an example that you can add via the plugin settings:

@media (max-width: 400px) {
    .show-support-ribbon[style] { right: 15px !important; top: 15px !important; }

That will apply to screens up to 400px wide, so you can adjust to whatever is needed. You can add whatever styles you want. In the example, we’re just moving the ribbon a little bit on the page. The !important declaration is needed only if overriding default styles.

Hoe maak je een niet-gekoppeld lint?

By default, the message displayed in the ribbon/badge is linked. To change that to display the message only (with no link), follow these steps:

1) For the option, “Select your style” choose “Custom”

2) In the “Markup” setting that appears, replace whatever is there with this:

<div id="show-support-ribbon" class="show-support-ribbon" style="{{css_div}}">{{text}}</div>

3) Then in the “CSS for div” setting, replace whatever is there with this:

position:fixed;right:-60px;top:30px;z-index:9999;box-sizing:border-box;display:block;width:220px;padding:10px 0;color:#fff;background:rgba(102,153,204,.9);font-size:12px;line-height:16px;font-family:'Lucida Grande','Lucida Sans Unicode','Lucida Sans',Geneva,Verdana,sans-serif;text-align:center;text-decoration:none;border:1px solid rgba(255,255,255,.7);transform:rotate(40deg);box-shadow:1px 1px 3px 0 rgba(0,0,0,.3);

Save changes and done. You may want to customize the CSS and/or other settings as desired. Results in a non-linked ribbon.

Heb je een vraag?

To ask a question, suggest a feature, or provide feedback, contact me directly.


12 december 2022 1 reactie
Вот, конкретно то, что надо. Поставил на все сайты новогодние ёлочки.
26 oktober 2020
Show Support Ribbon is easy to use, and just as easy to customize. I created a "badge" style ribbon with Show Support Ribbon using a custom image and developed a nice, floating link to our restaurant's online ordering site in very little time. Phenomenal support by Jeff is the other part of the success I had using the plugin. He responded to my support question in just a couple of hours. Even in the enterprise software world, that's a very short response window. Many thanks for Show Support Ribbon!
1 januari 2020
Really, I wasn't expecting this "ribbon" to be much of anything - but damn - it's amazing little plugin! It should have been called Corner Ribbon - that's what I wanted and the options available made that happen with no effort! But there are several options (badge, banner, link, etc.) - very cool treat - thank you! I purchased several of Jeff's plugins - I honestly didn't know he offered free WP plugins like this little gem, or written books too! Thank you for your hard work, Jeff, and very reasonably priced plugins - and free plugins - life saver, trust.
Lees alle 12 beoordelingen

Bijdragers & ontwikkelaars

“Show Support Ribbon” is open source software. De volgende personen hebben bijgedragen aan deze plugin.


“Show Support Ribbon” is vertaald in 2 talen. Dank voor de vertalers voor hun bijdragen.

Vertaal “Show Support Ribbon” naar jouw taal.

Interesse in ontwikkeling?

Bekijk de code, haal de SVN repository op, of abonneer je op het ontwikkellog via RSS.


If you like Show Support Ribbon, please take a moment to give a 5-star rating. It helps to keep development and support going strong. Thank you!

Version 20231025

  • Adds option to display ribbon only on home page
  • Updates default translation template
  • Tests on WordPress 6.4 (beta)

Version 20230712

  • Improves support panel logic
  • Improves plugin links function
  • Improves localization function
  • Updates default translation template
  • Tests on WordPress 6.3 (beta)

Version 20230228

  • Improves responsive styles
  • Improves logic when calling get_current_screen()
  • Moves WP Resources panel to its own function
  • Removes SES Pro from WP Resources panel
  • Tests on WordPress 6.1 + 6.2 (beta)
  • Tests on PHP 8.1 and 8.2

Versie 20220928

  • Adds custom footer text to plugin settings
  • Improves plugin documentation
  • Updates “Show Support” panel
  • Updates vertaal template
  • Getest met WordPress 6.1

Versie 20220516

  • Improves translation support (Thanks Alex Lion)
  • Generates new translation template
  • Getest met WordPress 6.0

Versie 20220115

  • Updates voor ondersteuningspaneel
  • Verbetert het laden van vertalingen
  • Updates some links to external resources
  • Changes minimum required WP version to 4.6
  • Getest met WordPress 5.9

Versie 20210714

  • Getest met WordPress 5.8

Versie 20210210

  • Increases maximum allowed characters on plugin options
  • Getest met WordPress 5.7

Versie 20201112

  • Adds option to add custom CSS
  • Lost enkele problemen op met PHP 8.0
  • Updates readme/documentatie
  • Updates vertaal template
  • Getest met PHP 7.4 en 8.0
  • Getest met WordPress 5.6

Versie 20200808

  • Refines readme/documentation
  • Getest met WordPress 5.5

Versie 20200314

  • Adds function ssr_display_styles()
  • Adds .show-support-ribbon to outer div
  • Makes HTML/markup editable in custom option
  • Improves/updates all default button styles
  • Improves ssr_display_ribbon() function
  • Updates CSS button styles and examples
  • Verbetert de UI van de plugin instellingenpagina
  • Generates new translation template
  • Getest met WordPress 5.4

Versie 20191102

  • Updates styles for plugin settings page
  • Getest met WordPress 5.3

Versie 20190902

  • Adds Targeted Display feature
  • Improves logic of ssr_validate_options()
  • Updates some links to https
  • Getest met WordPress 5.3 (alpha)

Versie 20190429

  • Bumps minimum PHP version to 5.6.20
  • Tweaks plugin settings screen content
  • Updates default translation template
  • Getest met WordPress 5.2

Versie 20190308

  • Adds check for admin user for settings shortcut link
  • Tweaks plugin instellingen scherm UI
  • Generates new default translation template
  • Getest met WordPress 5.1 en 5.2 (alpha)

Versie 20190220

  • Getest met WordPress 5.1


  • Adds missing closing tag to ribbon markup
  • Adds homepage link to Plugins screen
  • Updates default translation template
  • Getest met WordPress 5.0


  • Adds rel="noopener noreferrer" to all blank-target links
  • Replaces sanitize_text_field with wp_strip_all_tags for style settings
  • Tweaks appearance of plugin settings page
  • Updates GDPR blurb and donate link
  • Regenerates default translation template
  • Further tests on WP versions 4.9 and 5.0 (alpha)


  • Updates Show Support panel
  • Generates new translation template
  • Updates plugin image files
  • Getest met WordPress 5.0 (alpha)


  • Removes extra manage_options check for settings validation
  • Getest met WordPress 4.9


  • Fixes typo on plugin settings page
  • Getest met WordPress 4.9


  • Adds extra manage_options capability check to modify settings
  • Streamlines Support panel in plugin settings
  • Getest met WordPress 4.9


  • Updates GPL licentie blurb
  • Adds GPL license text file
  • Getest met WordPress 4.9 (alpha)


  • Refines display of settings panels
  • Updates show support panel in plugin settings
  • Adds note about hiding the ribbon on small screens
  • Fixes some incorrect translation domains
  • Replaces global $wp_version with get_bloginfo('version')
  • Getest met WordPress versie 4.8


  • Updates plugin auteur URL
  • Updates Twitter URL naar https
  • Changes stable tag from trunk to latest version
  • Refactors add_ssr_links() function
  • Updates URL for rate this plugin links
  • Getest met WordPress versie 4.7 (beta)


  • Streamlined and optimized the plugin settings page
  • Fixed apostrophe-backslash bug via esc_attr() and sanitize_text_field()
  • Renamed menu link from “Show Support Ribbon” to “Support Ribbon”
  • Replaced _e() with esc_html_e() or esc_attr_e()
  • Replaced __() with esc_html__() or esc_attr__()
  • Added plugin icons and larger banner image
  • Renamed text-domain from “ssr” to “show-support-ribbon”
  • Improved translation support
  • Getest met WordPress 4.6


  • Replaced icon with retina version
  • Added screenshot to readme/docs
  • Retina versie van banner toegevoegd
  • Reorganized and refreshed readme.txt
  • Getest op WordPress versie 4.5 beta


  • Updated heading hierarchy in plugin settings
  • Updated translation template file
  • Updated minimum version requirement
  • Tested on WordPress 4.4 beta


  • Getest met WordPress 4.3
  • Updated minimum version requirement


  • Getest met WP 4.2 + 4.3 (alpha)
  • Changed a few “http” links to “https”


  • Getest met de laatste versie van WP (4.1)
  • Minimale versie verhoogd naar WP 3.8
  • Verouderde screen_icon() verwijderd
  • Added $ssr_wp_vers for version check
  • Stroomlijn/verfijn plugin code
  • Added Text Domain and Domain Path to file header
  • Added translation .pot template in /languages/


  • Tested on latest version of WordPress (4.0)
  • Increased minimum version requirement to WP 3.7
  • Added conditional check for min-version function


  • Tested with latest WordPress (3.8)
  • Added trailing slash to load_plugin_textdomain()


  • uninstall.php bestand toegevoegd
  • Added “rate this plugin” links
  • i18n ondersteuning toegevoegd


  • Added line to prevent direct loading of script
  • Removed closing “?>” from show-support-ribbon.php
  • Tested with latest version of WordPress (3.7)


  • Improved preset CSS (upped the z-index)
  • Algemene code check n clean
  • Overview and Updates admin panels toggled open by default


  • Added margins to submit button (now required in WP 3.5)
  • Added option to open ribbon-link in new tab or same tab


  • Rebuilt plugin, generalized functionality, changed name, etc.


  • Z-index toegevoegd aan lintstijlen.


  • Initiële versie.