cs-icon.svg

Heldenbanner

A “Hero Banner” is a large, visually appealing image or video that is prominently displayed at the top of a website's homepage. It is typically the first thing that visitors see when they land on a webpage and is designed to grab their attention.

The Hero Banner Content Model is a thoughtfully designed system for gathering and organizing essential information for the hero banner content that appears on your website's front page.

Let’s understand how this content model will assist you in creating a Hero Banner for your webpage.

  1. Analyzing Requirements for the Hero Banner

    The “Hero Banner” in your webpage will be the point of attraction for your webpage. It will include the brief details about your webpage and a Call-to-Action (CTA) button for the users.

    Here is how a Hero Banner will look like on your webpage:

    Analyze_Requirements_for_the_Hero_Banner.png
  2. Identifizieren des Inhaltsmodells

    Let's identify the fields that create the Hero Banner for your webpage content type that you see in the above step.

    Identifying_the_Content_Model_for_the_Hero_Banner.png
  3. Inhaltstyp entwickeln

    The “Hero Banner” content model contains the following set of fields. Let’s look in detail at what content types and fields were used to create the model.

    Heldenbanner Content Type: 
    Bannertitel: Das ist ein Titel field where you will add a unique name to your banner. It is a mandatory field and must be clear and concise. 
    Bannerbild: This field allows you to insert images in your banner. We have used a Datei field to make this possible.
    Hintergrund _: You can set a background color of your choice for the banner. Here, we have used a Benutzerdefiniert field that adds Farbe as an extension to make this possible.
    Text Color: You can set a text color of your choice for the banner. Here, we have used a Benutzerdefiniert field that adds Farbe as an extension to make this possible.
    Bannerbeschreibung: Das ist ein Mehrzeiliges Textfeld field where you can add content in the banner. This content can be a brief description of the content that you have included in the webpage or anything else.
    Call To Action: Das ist ein Link field to add links based on your requirement. 
    Is Banner Image Full Width?: Das ist ein Boolescher Wert field that controls whether the banner image on a web page is displayed in full width. By default, the banner image is displayed in full width i.e, the default value for this field is true.
    Ausrichtung des Bannerbilds: You can set the image alignment in the banner as per your requirement. To do this, we have used a Auswählen field with Single Choice as the Selection Type.
    Inhaltsausrichtung: You can set the alignment for the content as per your requirement. To do this, we have used a Auswählen field with Single Choice as the Selection Type to select the alignment of the content.

This completes the creation of the “Hero Banner” content model.

hero-banner.png

Zusätzliche Ressource:
War dieser Artikel hilfreich?
^