Sign in

Banner Blocks

Updated on October 2, 2024

To create a new banner block you should:

  1. Go to Banner Blocks under the Web Personalization menu.
  2. Choose a Page where you want the banner to appear.
    You can set different Banner strategies for various pages on your shop. Releva comes pre-configured with Home, Category, Product, Cart, and Search pages.
    • To create a new page, click on “New Page”:

    • Name your Page.
      Each page can contain as many banners as you want.
    • Add Matching URL
      For each new Page, you must add the matching URL by clicking on the gear icon.

      Add the page’s pathname (NOT the full URL) where you intend to showcase the recommenders/banners.

  3. At the bottom of the area of each page, select New Banner Block.

  4. Select these options from the details modal that displays:
    • A name for your banner (it will appear in the Releva Admin interface)
    • Tags (keywords)
    • The Banner from the dropdown menu
      Next, you have an Edit button to edit the selected banner. The Duplicate & Edit button will automatically make a copy of the banner and navigate you to the Content menu of the Banner.*Tags property is used to associate keywords with banners. As tags are returned in the banner object of the response by our JavaScript SDK, you can define a visualization strategy and customize the display of banners using keywords. You can define tags by writing in the text field and hitting ‘Enter’.


  5. Click on the Display Configuration section in the banner block. You can edit here:
    Banner type
    • Static
      Placed in a specific place via CSS selector and displayed all the time.
    • Pop-up
      Pop-ups, also known as lightboxes, typically display in the center of your website and are great at attracting attention from your visitors.
    • Bar
      Bars provide a full-width message that typically sits on top of your site or at the bottom.
    • Flyout
      Flyouts appear in the bottom right or left of a screen and are a bit more subtle than a pop-up, but more likely to draw attention than a banner or embed form because they include movement.
    • Custom
      Your integration will handle the visualization of the banner with custom JavaScript.

    • URL Filter
      You may choose to include or exclude this pageBlock from specic pages based on what the page URL looks like.For example, if you wish this banner/recommender to only appear on the page https://info@shop.com/categories/footwear, you should add footwear in the field URL contains. If you add footwear in the field URL doesn’t contain the pageBlock will NOT appear on the page https://info@shop.com/categories/footwear. If values are entered into both fields, you will activate both include and exclude filters.“` typing in both fields.
    • Advanced styling
      You can add advanced styling to the type of banner you are creating, like close button background, border, padding, rounding, etc.
    • Custom CSS
      Enter your custom CSS code in this section. To specifically target this template, you can utilize the ID selector #undefined-modal.