# Elements reference > All 13 elements you can add to a page — what each one shows, its content options and its design options. Product: NijeesWeb website builder · Source: https://www.nijeesweb.com/docs/website/building-pages/elements · Updated 2026-10-02 Add an element with the **+** inside any column. Each element's settings have a **Content** tab (what it shows), a **Design** tab (how it looks, including backgrounds, borders, animation and more — see [Advanced styling](https://www.nijeesweb.com/docs/website/building-pages/advanced-styling)) and an **Advanced** tab (which screen sizes show it, and its CSS class and ID). ## Text ### Heading A title, from **H1** (biggest, one per page) to **H6**. - **Content:** the heading text. - **Design:** alignment, size level (H1–H6), font size and unit (px, rem, em), weight, font family (or *Default Site Font*) and colour. > [!TIP] > Use one **H1** per page — usually the main title at the top — then H2 for sections and H3 for points within them. Search engines and screen readers rely on this order. ### Text Formatted paragraphs, made with a word-processor-style editor: bold, italic, links, lists, headings and alignment. ### Blurb A small "feature" block: an **icon or an image**, a short **title** and a line or two of **text** — perfect for "Free delivery", "24×7 support" and similar. - **Content:** choose **Icon** (search the built-in icon set), **Image** (from the media library — a transparent PNG works well) or **None**; then the **Words** and **Text** (line breaks are kept). - **Link:** *No link*, *A page on this site* or *A web address*. When linked, the whole blurb becomes one link, with no underline anywhere on it. - **Design (Blurb Design):** layout and icon position (*beside the words*, *level with the title*, *centred*), the gap, icon size and colour, the shape behind it, title and text fonts, and colours *When pointed at* (hover). ## Actions ### Button - **Content:** **Button Text**, **Button Link** — *External Link* (any web address) or *Another Page On Website* — and **Open Link In** a *New Window* or the *Same Window*. - **Design:** use a saved **button design** from the design library, or style it here: alignment, font size, weight and family, border radius and border, colours (normal and hover), padding, letter spacing, text transform (UPPERCASE, lowercase, Capitalize) and box shadow. ## Pictures and video ### Single Image - **Content:** **Image** — upload one or *Select from Media Folder*; **Alt text** describing what the picture shows (important for Google and for blind visitors). - **Design:** alignment, border radius and width. ### Single Video - **Content:** **Where the video comes from** — *A file from your media library* (pick one or upload a clip) or *YouTube, Vimeo or another link* (paste a normal link; it is converted for you). Both are remembered, so switching back keeps the other. Add an optional **Caption**. - **Design:** size and placement (alignment, shape, maximum width, fit and crop), frame (corner radius, border, shadow), playback for uploaded files (**Autoplay** — forces mute, **Loop**, **Start muted**, **Show controls**, **Play inline on phones**, **Preload**), a **Poster image**, picture treatment (opacity, brightness, contrast, saturation, blur, greyscale, zoom and shadow on hover), a play **icon over the video**, and **Show caption** with its placement and style. > [!NOTE] > For YouTube and Vimeo links the playback settings don't apply — the video site controls playback. ### Banners A full-width slider from one of your banner sets. - **Content:** **Select Banner Gallery**, and **Banner Image Border Radius** (for example `20px`). - Create banner sets under *Media › Banners* — see [Banners](https://www.nijeesweb.com/docs/website/content/banners). ### Image Gallery - **Content:** **Select Image Gallery** — one gallery, or *All Galleries* to show your galleries as a list; a limit on how many to show; border radius; **Display Gallery Title**. - **Design:** a saved gallery design from the design library (grid or carousel, gaps, shapes). - Visitors can open any picture full screen. Create galleries under *Media › Image Gallery* — see [Image galleries](https://www.nijeesweb.com/docs/website/content/image-galleries). ### Video Gallery The same as Image Gallery, for videos — plus **Autoplay Video**. See [Video galleries](https://www.nijeesweb.com/docs/website/content/video-galleries). ## Content from your libraries ### Testimonials Customer quotes from *Testimonials*. - **Content:** **Limit the number of items visible** — *No limit* or *Apply limit* and a number. - **Design:** follow the site's testimonial design, or pick a saved testimonial design; then name and quote fonts, sizes and colours. ### Form - **Content:** **Select Form** — any form you built under *Forms*. - **Design:** a saved form design, or input and label colours, borders, radius, fonts and padding, plus the **Submit button**'s text, colours and padding. - Every submission arrives in *Forms › Form Enquiries*. See [Forms](https://www.nijeesweb.com/docs/website/content/forms). ### Blogs A list of posts. - **Content:** **Select Categories** — pick one or more categories to list their posts, or *List Blog Categories* to show category cards instead. - **Design:** a saved blog design, or card settings: background, gap, border, shadow, hover effect (*Zoom* or *Shadow*), corner radius, padding, image corners, title size and length (*Full Title* or *Truncate After* a number of characters), and whether to show the **Publisher Name**, **Publish Date** and **Content / Excerpt**. ### Accordion Expandable questions and answers — ideal for FAQs. - **Content:** **Select Accordion**. Its items are managed under *Accordions / FAQs*; the same accordion can be placed on several pages. - **Design:** pick a saved accordion design — the full designer lives under *Design › Accordion*. ## Every element also has - **Visibility** — hide it on desktop, tablet or phone. See [Tablet & phone](https://www.nijeesweb.com/docs/website/building-pages/responsive-design). - **CSS class and ID** — for custom CSS. - **Advanced styling** — background, border, shadow, transform, filters, animation, transitions, position and scroll effects. See [Advanced styling](https://www.nijeesweb.com/docs/website/building-pages/advanced-styling).