Cards Paragraph

Cards - Paragraph Component

Grab attention with a striking photo or video and a clickable link using a cards paragraph component.

When to use it
  • Navigation to additional topics of interest or next steps.
  • Highlighting important areas
  • Add style
  • Group like content into categories.
Where to use it
  • Use inside a group only.
  • Can be used in a normal group.
Features
  • Card layout automatically changes for 1, 2, 3 or 4 card layouts.
  • Ability to add images or videos. Horizontal images work best.
  • Header can be used to offset the section.
  • Card title is optional. Text size changes for description based on title or no title.
  • Displays with a white background since used in a group.
  • Cards have hover effect when you mouse over them.

How to Add - Cards Paragraph Component

  1. Log into Drupal.
  2. Go to page you wish to edit.
  3. Click on + sign and add a "Group".
  4. Click on + sign to enter a new paragraph inside of a group.
    1. Choose Cards paragraph.
  5. Complete the form details.
    1. Header: Optional
    2. Button link: Optional
  6. Click Add Card.
    1. Title: Optional
    2. Image or video: Required
    3. Content: Required
    4. URL and Link Text: Required
  7. Click Save before exiting the paragraph.
  8. Save page as "In progress" or "Ready to Review".
Real Life Examples
4 Card Layout
Wheat
Card Title 1

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Sunsetting on campus
Card Title 2

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
A flowering tree and a man riding a bike on campus.
Card Title 3

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Barry Dunn meeting with students in the University Student Union
Card Title 4

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Button Link
3 Card Layout
Wheat
Card Title 1

Luctus habitant placerat ligula potenti elementum porta nam curabitur ad, nostra lacinia etiam nec odio bibendum dictum enim, duis platea neque a ultrices dis massa facilisi. Nulla imperdiet habitant sem convallis cum nec vel sodales, penatibus ligula proin augue tristique fusce nisl himenaeos ut, torquent magnis turpis venenatis ante tempor sagittis.
Sunsetting on campus
Card Title 2

Luctus habitant placerat ligula potenti elementum porta nam curabitur ad, nostra lacinia etiam nec odio bibendum dictum enim, duis platea neque a ultrices dis massa facilisi. Nulla imperdiet habitant sem convallis cum nec vel sodales, penatibus ligula proin augue tristique fusce nisl himenaeos ut, torquent magnis turpis venenatis ante tempor sagittis.
A flowering tree and a man riding a bike on campus.
Card Title 3

Luctus habitant placerat ligula potenti elementum porta nam curabitur ad, nostra lacinia etiam nec odio bibendum dictum enim, duis platea neque a ultrices dis massa facilisi. Nulla imperdiet habitant sem convallis cum nec vel sodales, penatibus ligula proin augue tristique fusce nisl himenaeos ut, torquent magnis turpis venenatis ante tempor sagittis.
Button Link
2 Card Layout
Wheat
Card Title 1

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Sunsetting on campus
Card Title 2

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Button Link
1 Card Layout
Wheat
Card Title 1

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.
Button Link
Card with Video
Video Option

This is just an example of what the paragraph component would look like. This text is simply here to fill space so you can see how the layout of your paragraph component will appear once the content is added. When you create your own, you can add any text you鈥檇 like here to fit your needs.

Additional Web Editing Resources

Web Editing Resources Web Support Open Sessions
Contact us
Photo of University Marketing and Communications
University Marketing and Communications
Physical Address
1007 Campanile Ave.
Brookings, SD 57007
Mailing Address
Communications Center 105, Box 2230
Brookings, SD 57007
Hours
Mon - Fri: 8:00 a.m.-5:00 p.m.
Follow Us