LogoLogo
Highlight and ShareGet QuotesDLXDLX PluginsMediaRon
Highlight and Share
Highlight and Share
  • Welcome to Highlight and Share
  • Getting Started
    • Installing the Plugin
    • Finding the Plugin's Settings
    • How Highlight and Share Works
    • Configuring the Display Settings
    • Enabling the Social Networks
    • Enabling Shortlinks
    • Advanced Selectors
    • Changing Themes and Appearance
      • The Theme Preview
      • Reordering the Social Networks
      • Choosing a Theme
      • Configuring a Custom Theme
  • Inline Highlighting
    • What is Inline Highlighting
    • How to Add Inline Highlighting to Text
    • Configure Inline Highlighting
  • Image Sharing
    • What is Image Sharing?
    • Configuring Image Sharing
  • Click to Share Shortcode
    • Shortcode Parameters
    • Custom Shortcode Themes
  • Click to Share Block
    • The Click to Share Block
    • Configuring the Block Editor Settings
  • Emails
    • Email Sharing
    • Email Admin Settings
  • Developers
    • Available Social Networks
    • Actions and Filters
      • Disable or Enable Text Selection
      • Changing Labels and Tooltips
      • Disabling CSS
      • Enabling or Disabling Social Networks
    • GitHub Repo
  • Quick Links
    • Highlight and Share Home
    • Highlight and Share Download
    • Support
    • MediaRon Home
    • DLX Plugins Home
    • Brand Assets
Powered by GitBook
On this page
  • Enabling Image Sharing
  • Enable Pinterest Sharing
  • Enable Web Share Sharing
  • Enable Only Image Sharing Using Web Share
  • Exclude Leading Image
  • Select Which Post Types to Enable Image Sharing
  • Sharing Preview
  • Sharing Location
  • Show on Hover (enabled or disabled)
  • Set up Exclusions
  • Setting the Button Labels
  • Setting the Button Shape
  • Changing the Pinterest Colors
  • Changing the Web Share Colors

Was this helpful?

Export as PDF
  1. Image Sharing

Configuring Image Sharing

You can customize the look and feel of how image sharing looks and behaves.

PreviousWhat is Image Sharing?NextShortcode Parameters

Last updated 10 months ago

Was this helpful?

Navigate to the Highlight and Share admin settings and click on the Images tab.

Enabling Image Sharing

Click "Enable Image Sharing" to allow Highlight and Share to show sharing icons on your post images.

Enable Pinterest Sharing

When enabled, a Pinterest icon will display on an image.

Enable Web Share Sharing

If on a supported browser or device, you'll see a "Share" option when hovering over an image.

On the user's mobile device, they can copy or share the image as they see fit.

Enable Only Image Sharing Using Web Share

Depending on your site, you may want to send only the image and not the URL where the image is located. This can be useful on tutorial sites or educational sites where users may want to copy the images for use in notes easily.

Airdropping and saving images: This option must be enabled to support Airdrop on Mac devices.

Exclude Leading Image

Sometimes, you have a featured image as the first image and want to skip that image. You can skip this "first" or leading image by checking the "Exclude Leading Image" option.

Select Which Post Types to Enable Image Sharing

You can select which post types have image sharing enabled by checking the enabled post types.

Sharing Preview

A sharing preview is shown periodically in the admin options to demonstrate what the sharing icons will look like when displayed on your site.

Sharing Location

By default, the sharing icons appear on the image's top-left.

Sharing locations can be:

  • Top Left

  • Top Right

  • Bottom Left

  • Bottom Right

  • Center

Show on Hover (enabled or disabled)

By default, the sharing options display when hovering. If you'd like them always visible, switch this option off.

Set up Exclusions

Matching every image can be tricky, so that's why there are exclusions.

Think of exclusions as a way to filter out any images you don't want shared.

Enter a keyword, CSS class name, or data attribute, and the image is skipped if a match is found.

Setting the Button Labels

This section allows you to show or hide the button labels and customize them to match the wording on your site.

If you choose to hide the labels, only the icons will display.

Setting the Button Shape

Set the button shape, which can be:

  • Rounded

  • Circle

  • Square

The circular button shape is not recommended if the button labels are visible.

Choose rounded for a button with a slight border-radius.

You can also hide the labels and use the Rounded button shape.

Choose the Square button shape for a more traditional button appearance.

Choose the Circle button shape if you wish to display the icons only in a circular shape. Please note that the Circle button shape is only recommended if the labels are hidden.

Changing the Pinterest Colors

All colors for the Pinterest sharing icon and label can be customized.

Each color can be adjusted to match your site.

A live preview is beneath the color options to see the changes quickly.

Changing the Web Share Colors

All colors for the Web Share sharing icon and label can be customized.

You can use the color picker to match the button to your site.

The allows for more native sharing and is typically only available on mobile devices or in supported browsers like Safari.

Web Share API
Image Sharing Options in Highlight and Share
Enable Image Sharing Option
Enable Pinterest Sharing on an Image
Pin It Badge on Images on Hover
Web Share API on Images
Web Share on the Safari Browser
Web Share on a User's Mobile Device
Share Image Only Option for Web Share
Exclude Leading Image Option for Image Sharing
Post Type Options for Image Sharing Display
Sharing Preview
Set the Sharing Location
Sharing Location in the Image Sharing Settings
Example of Center-Aligned Sharing Options
Show on Hover Option for Image Sharing
Set up Exclusions to Match Keywords or CSS or Data Attributes
Show, Hide, and Customize the Button Labels
Hide the Sharing Button Labels to Show Icons Only
Set the Button Shape
Rounded Button Appearance with Labels
Rounded Button Appearance with Labels Hidden
Square Button Appearance
Circle Button Shape with Labels Hidden
Pinterest Color Options
Pinterest Color Picker Option
Web Share Color Options
Customize the Web Share Colors