> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://care.coreware.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# coreFORCE - Website: Adding text banners to your site

||| coreFORCE Advanced and Enterprise Only

1. Navigate to **Website** > **Templates** > click **Content** Tab and Insert %module:fragment:TEXT_SLIDER% after the <header> tag.

Set up your slider wrapper markup.

``` 
<body>
  <div id="error_message" class="error-message"></div>
    <div id="_wrapper" class="hidden">
     <header>
        %module:fragment:TEXT_SLIDER%
    ```

2. Once added, navigate to **Website** > **Fragments**. Create a new Fragment called “Text Slider”

![Fragments](https://storage.crisp.chat/users/helpdesk/website/6989aace46840400/u53cyp5ncynmjdosyixmpsbe2myq7v_1jrulqo.png)

3. Insert this content into the Fragment’s content.

```     
<style>
  .text-slider {
    background-color: #000000; /*Update this*/
    color: #ffffff; /*Update this*/
    padding: 5px;
    text-align: center;
  }

  .text-slider p {
    margin: 0;
  }
</style>

<div class="text-slider">
  <div class="text-item">
    <p>Update me</p> 
  </div>
  <div class="text-item">
    <p>You can delete me or add a new text slider</p>
  </div>
</div>

<script>
  $(function () {
    var $textSlider = $(".text-slider");
    $textSlider
      .slick({
        arrows: false,
        autoplaySpeed: 5000,
        autoplay: true,
        dots: false,
        infinite: true,
      })
      .on("setPosition", function () {
        if (!($(this).find('.slick-slide').length > 1)) {
          $(this).find(".slick-arrow").hide();
        }
      });
  })
</script>
             ```

4. Update the background and color in the <style></style> section to match your website’s theme. The text to be displayed should also be updated and if you want to add more.  Insert this element inside the class "text-slider":

```   
 <div class="text-item">
   <p>Update me</p> 
 </div>
    ```   

5. Click Save.