Return to previous page

Product description like demos - by silentmedia

This topic has 2 replies, 2 voices, and was last updated 7 years ago ago by Olga Barlow

silentmedia

Participant

March 18, 2017 at 17:57

Hello,

How can get the product descriptions like it see in your demo. example…

https://www.8theme.com/demo/xstore/shop/accessories/classic-gold-watch-2/

You can see the description has what look like banners in description?

#157265 Copied

1 Answer

Olga Barlow

Support staff

March 22, 2017 at 15:27

Hello,

We used Visual Composer editor to create such description http://prntscr.com/en3yvj
To enable VC for the product go to Visual Compose > Role Manager > Post type > Custom > choose also Products.

If you have already enabled VC for the product and just need the code what was used for the description then use switch to Classic editor and paste the following at the Text tab. Switch back to VC editor after that

[vc_row][vc_column width="1/6"][/vc_column][vc_column width="2/3"][vc_column_text]
<p style="text-align: center;">Posuere a eleifend senectus consectetur nostra pharetra adipiscing cum posuere magna in quam ultricies condimentum augue ridiculus. Condimentum euismod pharetra consequat primis magnis volutpat a a porttitor auctor vestibulum ad luctus a a quam adipiscing odio a.</p>
[/vc_column_text][/vc_column][vc_column width="1/6"][/vc_column][/vc_row][vc_row full_width="stretch_row_content" equal_height="yes" content_placement="middle" css=".vc_custom_1452601735256{margin-top: 20px !important;padding-top: 20px !important;padding-bottom: 0px !important;background-color: #fcfcfc !important;}"][vc_column css=".vc_custom_1452601157191{margin-bottom: 0px !important;}" offset="vc_col-lg-4 vc_col-md-12 vc_hidden-md vc_hidden-sm vc_hidden-xs"][vc_single_image image="553" img_size="440x600" alignment="right" css_animation="appear" css=".vc_custom_1452606760802{margin-bottom: 0px !important;}"][/vc_column][vc_column width="1/2" offset="vc_col-lg-4 vc_col-md-6"][vc_column_text css=".vc_custom_1452591002149{padding-right: 50px !important;padding-left: 50px !important;}"]
<h5 style="text-align: center;">Product description</h5>
<h1 style="text-align: center; font-weight: 300;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus lorem.</h1>
<p style="text-align: center;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
[/vc_column_text][/vc_column][vc_column width="1/2" offset="vc_col-lg-4 vc_col-md-6"][vc_single_image image="555" img_size="440x600" css_animation="appear" css=".vc_custom_1452606776477{margin-bottom: 0px !important;}"][/vc_column][/vc_row][vc_row css=".vc_custom_1452606891841{margin-top: 7% !important;}"][vc_column width="1/4"][/vc_column][vc_column width="1/2"][vc_custom_heading text="Product Details" font_container="tag:h2|font_size:30px|text_align:center|color:%231c1a19|line_height:28px" use_theme_fonts="yes"][vc_column_text]
<p style="text-align: center;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium. Maecenas scelerisque interdum dolor in vestibulum.</p>
[/vc_column_text][/vc_column][vc_column width="1/4"][/vc_column][/vc_row][vc_row css=".vc_custom_1452596352789{margin-bottom: 10px !important;}"][vc_column css=".vc_custom_1452606026318{margin-top: 60px !important;padding-right: 40px !important;}" offset="vc_col-lg-4 vc_col-md-6"][vc_column_text css_animation="left-to-right"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: right;"><span class="active-color">01.</span> PASSION</h4>
<p style="text-align: right;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][vc_column_text css_animation="left-to-right"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: right;"><span class="active-color">02.</span> DILIGENCE</h4>
<p style="text-align: right;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][vc_column_text css_animation="left-to-right"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: right;"><span class="active-color">03.</span> PRECISION</h4>
<p style="text-align: right;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][/vc_column][vc_column offset="vc_col-lg-4 vc_hidden-md vc_hidden-sm"][vc_single_image image="556" img_size="870x1160" alignment="center" css_animation="appear"][/vc_column][vc_column css=".vc_custom_1452606030795{margin-top: 60px !important;padding-left: 40px !important;}" offset="vc_col-lg-4 vc_col-md-6"][vc_column_text css_animation="right-to-left"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: left;"><span class="active-color">01.</span> PASSION</h4>
<p style="text-align: left;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][vc_column_text css_animation="right-to-left"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: left;"><span class="active-color">02.</span> DILIGENCE</h4>
<p style="text-align: left;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][vc_column_text css_animation="right-to-left"]
<h4 style="font-weight: 900; letter-spacing: 2px; text-align: left;"><span class="active-color">03.</span> PRECISION</h4>
<p style="text-align: left;">Etiam nulla nunc, aliquet vel metus nec, scelerisque tempus enim. Sed eget blandit lectus. Donec facilisis ornare turpis id pretium.</p>
[/vc_column_text][/vc_column][/vc_row]

Regards

#157544 Copied