Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The CC Teaser and text component provides you an option to add an image and a text which can be used for numerous scenarios, e.g. category pages, landing pages and product detail pages. Both teaser and text can be adjusted and enhanced with the contrast optimizer.

 

Image RemovedImage Added

 

The new featured contrast optimizer contains following options:

...

  1. In the image upload area you can insert an image using the Magento 2 media explorer. [2] If you already have an image, you can remove it using the “bin” icon. By clicking “change” you can change an existing image. Regardless whether you have chosen an image or not there always will be shown a live preview with your slogan and description. There is also a possibility to add video - more 2.16. Video Teasers.

  2. In the CONTENT ALIGN area you are able to control the text appearance on the image teaser. Just click on the desired position field where the text should be shown.

  3. Enter the SLOGAN text which will be the most prominent text element on the image teaser (depending on the styling). Additionally it is possible to insert dynamic content in this text and any other textfield component, e.g. HEADLINE and DESCRIPTION using Content Constructor Directives. By adding directives it will display your products’ price or a products’ discount percentage to your desired text field.

    1. Fetching a products’ price can be done with this directive:
      {{price sku=”your_product_sku” withCurrency=”true”}}
      When choosing “false” as your parameter there is no currency sign displayed.

    2. If you wish to display a discount percentage of a certain product use following directive:
      {{discountPercentage sku=”your_product_sku”}}

    3. However only an integer value will be shown.

  4. Enter the DESCRIPTION text which will be the text element located underneath the slogan on the image teaser (depending on the styling). Also Constructor Directives can be used here.

  5. Enter a CTA LABEL text in case you want to include a CTA button on the image teaser.

  6. Enter a URL in the CTA TARGET LINK input in case you want to add a link to the CTA button (also the Magento 2 widget types CMS Page Link, Catalog Category Link, Category Product Link, File URL are supported).

...