WP Reactions Documentation WP Reactions Documentation
  • Knowledge Base 
  • Open a Ticket 
Ask a Question
WP Reactions Documentation WP Reactions Documentation
Ask a Question
WP Reactions Documentation
  • Knowledge Base 
  • Open a Ticket 

WP Reactions

  • folder icon closed folder iconGetting Started
    • Download WP Reactions
    • Installing WP Reactions
    • Activate License Key
    • Quick Start Guide
    • Revoke License Key
  • folder icon closed folder iconEmoji Reaction Layouts
    • Original Reactions
    • Reaction Button
    • Jane Reactions
    • Jimbo Reactions
    • Mini Reactions
  • folder icon closed folder iconLayout Options
    • Emoji Picker
    • Emoji Reveal
    • Flying Animated Text
    • Reaction Button Design
    • Reaction Container Styling
    • Emoji Animation
    • Call to Action
    • Random Counts
    • Fake Counts
    • Button Padding
    • Emoji Border Styling
    • Emoji Background Styling
    • Emoji Sizes
    • Shortcode Alignment
    • Emoji Badges
    • Flying Animation Effect
    • Primary Call to Action
    • Social Share Call to Action
    • Button Icon Styling
  • folder icon closed folder iconSettings
    • General
    • Advanced
    • WooCommerce Reactions
  • folder icon closed folder iconSocial Media Sharing
    • Social Share Platforms
    • Button Design
    • Share Counter
    • Button Behavior
    • Social Popup Overlay
  • folder icon closed folder iconWPML Intergration
    • Installing Required WPML Plugins
    • Translate Global Activation
    • Translate Shortcodes
  • folder icon closed folder iconShortcode Generator
    • Shortcode Editor
    • Bind Shortcode to Post
  • folder icon closed folder iconGlobal Activation
    • On Page Options
    • Custom Post Types
  • folder icon closed folder iconAnalytics
    • Emoji Reaction Data
    • Social Sharing Data
  • folder icon closed folder iconTools
    • Advanced Random Counts
    • Reset User Counts
  • folder icon closed folder iconDevelopers
    • Action Hooks & Filters
    • JavaScript Events
loading
Popular Searches
  • Global Activation
  • Shortcode
  • Layout Options
  1. Home
  2. WP Reactions
  3. Layout Options
  4. Reaction Container Styling
Updated on December 11, 2021

WP Reactions

  • folder icon closed folder iconGetting Started
    • Download WP Reactions
    • Installing WP Reactions
    • Activate License Key
    • Quick Start Guide
    • Revoke License Key
  • folder icon closed folder iconEmoji Reaction Layouts
    • Original Reactions
    • Reaction Button
    • Jane Reactions
    • Jimbo Reactions
    • Mini Reactions
  • folder icon closed folder iconLayout Options
    • Emoji Picker
    • Emoji Reveal
    • Flying Animated Text
    • Reaction Button Design
    • Reaction Container Styling
    • Emoji Animation
    • Call to Action
    • Random Counts
    • Fake Counts
    • Button Padding
    • Emoji Border Styling
    • Emoji Background Styling
    • Emoji Sizes
    • Shortcode Alignment
    • Emoji Badges
    • Flying Animation Effect
    • Primary Call to Action
    • Social Share Call to Action
    • Button Icon Styling
  • folder icon closed folder iconSettings
    • General
    • Advanced
    • WooCommerce Reactions
  • folder icon closed folder iconSocial Media Sharing
    • Social Share Platforms
    • Button Design
    • Share Counter
    • Button Behavior
    • Social Popup Overlay
  • folder icon closed folder iconWPML Intergration
    • Installing Required WPML Plugins
    • Translate Global Activation
    • Translate Shortcodes
  • folder icon closed folder iconShortcode Generator
    • Shortcode Editor
    • Bind Shortcode to Post
  • folder icon closed folder iconGlobal Activation
    • On Page Options
    • Custom Post Types
  • folder icon closed folder iconAnalytics
    • Emoji Reaction Data
    • Social Sharing Data
  • folder icon closed folder iconTools
    • Advanced Random Counts
    • Reset User Counts
  • folder icon closed folder iconDevelopers
    • Action Hooks & Filters
    • JavaScript Events

Reaction Container Styling

Estimated reading: 2 minutes 5199 views

This option is available in Mini Reactions and Jane Reactions. 

What is container styling?

The container is the frame or box around each emoji in the Mini and Jane Reaction layouts. These containers are fully customizable.

Breakdown of Options

The options for container styling let you customize every aspect of the container. Easily manage these settings with dropdowns and color pickers.

Border Radius – This option controls the the corners of the box. You can use this dropdown to choose from 0px for square edges all the way up to 60px for fully rounded edges and anything in between to make your containers the way you want.

Border Width – This dropdown allows for you to choose how thick you want you container border. You can choose from 0px to 60px. The higher number you choose, the thicker the border will be for the container.

Border Color – Use this color picker by clicking over it and dragging your mouse to the color that is best for you. Or simply paste your own color code into the color picker input box and that color will be shown.

Border Style – This option lets you choose the style of border you want around your emojis. Simply select the one you want from the dropdown menu.

Active Color – The active color is the color that a user clicks on. It is the color inside of the container box. You can choose a color for this option by using the color picker. or, paste your color code into the color picker input box.

This option is available in the following layouts:

You can find this option in Mini Reactions and Jane Reactions layouts.

FAQ's

What if I skip this option?

If you decide to skip this option our default settings will be used. You can always come back later to change anytime.

How do I hide the containers and just show emojis?

If you would like hide containers, simply make the border color and active color the same color as your page. In most cases that will be white. When doing this, your containers are hidden.

Still need help?

Helpful? Yes No

How can we help?

A premium WordPress theme with integrated Knowledge Base,
providing 24/7 community based support.

CONTENTS

Quick Links

  • Demo Site
  • Pricing
  • Contact Us

Products

  • WP Reactions PRO
  • WP Reactions Lite
  • Emoji Uploader

Support

  • Open a Ticket
  • Lite Support
  • Knowledge Base
  • Terms of Use
  • Refund Policy
  • Privacy

© Copyright 2022, All Rights Reserved WP Reactions, LLC