January 14

Content Boxes Example

0  comments

Content Box Examples

In your "DFY" website template, we've included 9 different color Content Boxes. They are great for highlighting blocks of content and adding some visual variety to a page. In most cases...you would only use Content Boxes for a small amount of content and NOT a whole page of content.

Content Box Colors

[thrive_text_block color=”blue” headline=”Blue Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.
[/thrive_text_block]

[thrive_text_block color=”dark” headline=”Dark Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”green” headline=”Green Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”light” headline=”Light Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”note” headline=”Note Content Box”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”purple” headline=”Purple Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”red” headline=”Red Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”teal” headline=”Teal Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

[thrive_text_block color=”orange” headline=”Orange Content Box”]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum porta orci a interdum ullamcorper. Donec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel. Cras nulla purus, fermentum sed elit ut, fringilla consequat quam. Integer nec elementum arcu, non euismod tellus.[/thrive_text_block]

This is how the HTML Code looks that created the Content Boxes above.

Enter HTML Code here


Custom Box

There are two types of customizable content boxes available in our "DFY" Done-For-You website templates. The first is a box with a custom background and custom border color:

[thrive_custom_box title=”Custom Color Box” style=”dark” type=”color” color=”#f1edfc” border=”#8224e3″]You can choose a Custom Color Background and a Custom Color Outline.┬áDonec tempus sem eu massa vehicula tincidunt. Maecenas auctor dolor magna, vitae adipiscing justo commodo vel.[/thrive_custom_box]

This is how the HTML Code looks that created the Content Boxes above.

Enter HTML Code here


The second type is a Content Box with a custom image background. In this example, the image background is also combined with a content container, for more control over the layout:

[thrive_text_block color=”light” headline=””][thrive_custom_box title=”” style=”light” type=”image” image=”http://buildmyfirstwebsite.org/wp-content/uploads/2015/01/loren-ipsum.jpg” full_height=1][/thrive_custom_box] [/thrive_text_block]


Tags


You may also like

TCB Custom HTML Element

TCB Credit Card Icons Example

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}

Subscribe to our newsletter now!