Social Share

No-JS, lightweight social share links for Facebook, Twitter, LinkedIn, Email, Pinterest, WhatsApp & Telegram that you can style 100% visually.

Option Controls

Display

Provides options to either show just text links, icon links or both.

Font Size

By default, the icon sizes and the padding for the buttons are all using ems, so changing the overall font size is quick way to scale the entire button to the size you need.

Layout / Position

Allows you to control the inner layout of the social links.

Sticky positioning can be added easily in the layout settings, as long as the social share buttons component is inside an element which either has other elements inside it or a preset height.

Social Networks

Each network has it’s own settings to be able to customise how the links function, to show / hide each link individually and to change the icons used in each button.

Style Controls

The overall buttons, icons or just text can all be styled separately. The buttons can be styled with the original brand colours from the networks themselves or with all custom colours.

Print

From OxyExtras v1.4.7+ there’s an option to add a print button.

By default, clicking the print button will just have the same result as when you’d typically go to the browser settings and choose ‘print page’, so everything on the page will be included, and the styling purely based on your overall stylesheet and current print styles of the site. We’ve added some settings to make it a bit easier to control what is included in the print..

Selector of content area to print – This allows you to choose a specific section/container just by targeting by ID or class the area of the page you want to appear in the print. Everything else will be removed as if it was hidden with ‘display: none’.

Print color adjust – Choose economy or exact. See the differences here.

Remove share buttons from print – Will ensure the social share button element isn’t included on the page.

If you have a chosen container which has the content you want to print, but also includes a few things that you don’t want to show. Add the utility class ‘x-print-no-print’ to those elements. This will ensure they are excluded from the print.

Note that generally with printing websites, you may need to adjust the styling with @media print styles, to get things looking more suitable for print. It’s going to be quite unique based on the CSS on your site. You can add a stylesheet inside Oxygen and add your styles like so..

@media print {
  /* your styles for print here */
}

What styles you add here will be unique for your site. Refer to the following article if you’re unfamiliar – How to set up a print style sheet

chevron-down