Snippets are a type of content that you insert onto a page and can then edit without changing the original file. Often, they are used to make items such as accordions, tables or image frames, where the snippet provides the styling, and the editor fills in unique content as they place it on the page. Snippets are formatted as a table, so while editing snippets the editor will place content into the fields as labeled by the table’s header.

There are several design elements that can be added as a Snippet or a Component. Keep in mind, that if a snippet breaks or needs to be updated (in terms of style or functionality) the snippet content on the page will need to be deleted and rebuilt manually. Because of this, it is better to use a component over a snippet (when applicable). 

 

 

Accordion

  • Function: Expand/collapse content sections.
  • Use Cases: FAQs, content-heavy pages.
Collapsible Group Item #1

Ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui

Collapsible Group Item #2

Heading 3

You can enter content freely. for an accordion panel.

Collapsible Group Item #3
Even when you skip a row, you want to go off by the number indicated in the heading column when you are setting a specific panel to open on load.

Featured Issue

  • Purpose: Draws attention to a significant concern or subject.
  • Display: Typically showcased prominently on a website or platform.
  • Use Cases: Commonly used in editorial content, campaigns, or awareness initiatives.
Cover
SPRING 2021

North Texan magazine connects UNT alumni and friends to the university and keeps you updated on what's happening on campus and within our community.

Visit us between our print issues to:

  • submit your news
  • write memorials about friends we'll miss
  • read the print version on Issuu

We want to hear from you.

Issues published in Summer 2009 and later are available here. For older issues, please visit the archive.

Grid Block

  • Use Cases: Commonly employed for displaying images, products, or content cards.
  • Responsive Design: Adapts well to different screen sizes.
Grid Block Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Grid Block Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Grid Block Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Grid Block Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Hero

  • Only allowed in the Hero Section
  • Use Cases: Commonly used for introductions, promotions, or featured content.
  • Design Impact: Sets the visual tone, establishes a focal point.

Hero Blur

  • Only allowed in the Hero Section
  • Purpose: Creates a blurred background for a captivating visual effect.
  • Use Cases: Often utilized for a modern and immersive design experience.

Intro Buttons

  • Purpose: Prompts user engagement or directs actions.
  • Placement: Typically positioned in prominent areas for user visibility.
  • Functionality: Triggers navigation, exploration, or interaction.

Here's an intro pragraph. There were at least two parallel-universes where there were evil counterparts of the Justice League of America. The oldest of these was Earth-Three, which had a group of five villains that went by the name Crime Syndicate of America.

Local Alerts

  • Purpose: Informs users about events, offers, or relevant information in their vicinity.
  • Use Cases: Commonly employed by businesses, services, or events for localized communication.

Pre-Footer 

  • Location: Section positioned above the website's footer.
  • Function: Provides additional content or navigation before reaching the footer.
  • Use Cases: Often used for supplementary links, calls-to-action, or secondary information.
UNT | University of North Texas circle badge
Thinking about UNT?

It’s easy to apply online. Join us and discover why we’re the choice of over 46,000 students.

Pre-Footer Contact

  • Location: Section above the footer, specifically dedicated to contact information.
  • Function: Offers a convenient and accessible area for users to find contact details.
Contact Admissions

Ways to contact

Lorem ipsum dolor sit amet, additional content and information goes here.

Pre-Footer News

  • Location: Section positioned above the website's footer.
  • Function: Highlights recent or important news items.
  • Content: Includes news snippets, headlines, or featured articles.

Tabs

  • Interface Element: Divides content into distinct sections.
  • Use Cases: Commonly used for organizing information or navigation in a clean layout.

Tab 1 Et et consectetur ipsum labore excepteur est proident excepteur ad velit occaecat qui minim occaecat veniam. Fugiat veniam incididunt anim aliqua enim pariatur veniam sunt est aute sit dolor anim.

Velit non irure adipisicing aliqua ullamco irure incididunt irure non esse consectetur nostrud minim non minim occaecat. Amet duis do nisi duis veniam non est eiusmod tempor incididunt tempor dolor ipsum in qui sit.

Exercitation mollit sit culpa nisi culpa non adipisicing reprehenderit do dolore. Duis reprehenderit occaecat anim ullamco ad duis occaecat ex.

WYSIWYG Section

  • Acronym: Stands for "What You See Is What You Get."
  • Purpose: Allows users to edit content visually, resembling its appearance on the final page.
  • Use Cases: Commonly found in content management systems for creating and editing web content.

Here's something from a standard WYSIWYG entry

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque molestie bibendum justo, a vulputate est aliquam eu. Ut justo sem, ultrices sit amet ex in, dictum dapibus felis. Etiam sagittis laoreet nunc, nec ultrices purus tristique in. Nulla ligula felis, interdum sit amet gravida nec, laoreet quis ipsum.