We created the Elements Page to get managing your Magento 2 store simple. The page makes it easier to create content. The page includes ready-to-use widgets and HTML snippets with predefined styles. Adding and configuring the mentioned blocks doesn't require any programming skills. Now you can simply implement them in various places on your website. The benefit of using the information of Elements Page is that the same block or widget can be reused on multiple pages. That saves you lots of time when creating and updating content.
You can use the blocks as a navigational tool. They include links to popular content of your store. Both images and a brief introduction present whatever you believe your visitors will find valuable.
New
In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique. Nam vel iaculis mauris. Sed ullamcorper tellus erat, non ultrices sem tincidunt euismod. Integer et elit eget elit facilisis tristique.
Shop Now
<div class="image-block left element"> <div class="info"> <p class="label">New</p> <h2 class="heading">Adventure Starts Now</h2> <p class="text"> In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique. Nam vel iaculis mauris. Sed ullamcorper tellus erat, non ultrices sem tincidunt euismod. Integer et elit eget elit facilisis tristique. </p> <a href="" class="action primary"> <span>Shop Now</span> </a> </div> <div class="picture"> <img src="{{media url="wysiwyg/elements/argento/force/banner-image-left.png"}}" alt="" /> </div> </div>
New
In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique. Nam vel iaculis mauris. Sed ullamcorper tellus erat, non ultrices sem tincidunt euismod. Integer et elit eget elit facilisis tristique.
Shop Now
<div class="element image-block right"> <div class="info"> <p class="label">New</p> <h2 class="heading">Adventure Starts Now</h2> <p class="text"> In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique. Nam vel iaculis mauris. Sed ullamcorper tellus erat, non ultrices sem tincidunt euismod. Integer et elit eget elit facilisis tristique. </p> <a href="" class="action primary"> <span>Shop Now</span> </a> </div> <div class="picture"> <img src="{{media url="wysiwyg/elements/argento/force/banner-image-right.png"}}" alt="" /> </div> </div>
With the block code, you can add the dividers as section background images. The dividers bring a little originality to a web page. Plus, the image can present links to the important content of your store.
Three-piece toe construction for classic tennis support and performance.
<div class="element background-divider a-center"> <img src="{{media url='wysiwyg/elements/argento/force/nike-collection.png'}}" alt="Nike Collection" /> <div class="content"> <div class="block-title"> <strong role="heading" aria-level="3">New Nike Collection</strong> <p class="subtitle">Three-piece toe construction for classic tennis support and performance.</p> </div> <a href="{{store direct_url=''}}" title="Shop Now" class="action primary"><span>Shop Now</span></a> </div> </div>
The blocks have an informative role to play. A piece of important content along with memorable icons will help you to communicate with your customers who speak multiple languages. The blocks with icons compact information into one easily recognizable symbol. Within a text block, you can add custom-designed icons too.
In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique.
<div class="element icon-text-small"> <div class="description"> <h2 class="heading argento-force-title"><strong role="heading" aria-level="3">Stylish interiors for everyone</strong></h2> <p class="text">In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis tristique.</p> </div> <div class="icons"> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-check.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-location.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-heart.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-tags.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-money.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> <div class="item"> <div class="icon"><img src="{{media url="wysiwyg/elements/argento/force/icons/icon-sale.svg"}}" alt="" /></div> <div class="info"> <h4 class="title">Donec rutrum congue</h4> <div class="text">Donec rutrum congue leo eget malesuada. Nulla porttitor accumsan tincidunt. </div> </div> </div> </div> </div>
<div class="element icon-text-big"> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-shield"></i></div> <div class="info"> <h3 class="title">Secure Payments</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-100percent"></i></div> <div class="info"> <h3 class="title">Money Back</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-delivery"></i></div> <div class="info"> <h3 class="title">Fast Delivery</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> </div>
<div class="element icon-text-top"> <div class="block-title"> <strong role="heading" aria-level="2">Explore our store</strong> </div> <div class="content"> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-shield"></i></div> <div class="info"> <h3 class="title">Secure Payments</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-100percent"></i></div> <div class="info"> <h3 class="title">Money Back</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> <div class="item"> <div class="icon"><i class="force-icon force-icon-bigger force-delivery"></i></div> <div class="info"> <h3 class="title">Fast Delivery</h3> <div class="text">Order online, avoid the shipping costs, and collect your items from any of our 56 stores nationwide, whenever and wherever is most convenient for you.</div> </div> </div> </div> </div>
The Logos Slider is perfect for displaying a list of brands available in your store. You can also use it to show your partner or client logos. With the block code, you can add your slider to your site quickly and easily. Made using Easy Slider module widget.
<div class="block block-carousel element brands-slider"> <div class="block-title argento-force-title"> <strong role="heading" aria-level="3">Brands</strong> </div> <div class="block-content"> {{widget type="Swissup\EasySlide\Block\Slider" identifier="argento_force_brands"}} </div> </div>
The block/widget enables you to display a short description of the product on a category, other product listing pages, and product page. Using block/widget you will easily show the main information of your product briefly to arouse interest. Built with Highlight module widget.
<div class="element product-info">{{widget type="Swissup\Highlight\Block\ProductList\All" title="" carousel="0" products_count="1" column_count="1" page_count="1" order="default" dir="asc" template="Swissup_Highlight::product/list.phtml" mode="list" show_page_link="0" conditions_encoded="^[`1`:^[`type`:`Magento||CatalogWidget||Model||Rule||Condition||Combine`,`aggregator`:`all`,`value`:`1`,`new_child`:``^]^]" hide_when_filter_is_used="0"}}</div>
The block displays products in a product grid. It shows 4 products per row on the desktop and 2 per row on mobile. You can select a list of products manually. You can expand the grid with columns, custom text, labels. Built with Highlight module widget.
<div class="element products-grid hero">{{widget type="Swissup\Highlight\Block\ProductList\All" title="Explore our store" carousel="0" products_count="8" column_count="4" page_count="1" order="default" dir="asc" template="Magento_Catalog::product/list.phtml" mode="grid" show_page_link="0" conditions_encoded="^[`1`:^[`type`:`Magento||CatalogWidget||Model||Rule||Condition||Combine`,`aggregator`:`all`,`value`:`1`,`new_child`:``^]^]" hide_when_filter_is_used="0"}}</div>
The widget allows you to show the attractive product slider on your site. You can add a carousel to posts, pages, sidebars. This is a great way to showcase your products and increase conversions. Built with Highlight module widget with ajax carousel enabled.
<div class="element products-slider hero">{{widget type="Swissup\Highlight\Block\ProductList\All" title="Related products" carousel="1" products_count="4" column_count="4" page_count="2" order="default" dir="asc" template="Magento_Catalog::product/list.phtml" mode="grid" show_page_link="0" conditions_encoded="^[`1`:^[`type`:`Magento||CatalogWidget||Model||Rule||Condition||Combine`,`aggregator`:`all`,`value`:`1`,`new_child`:``^]^]" hide_when_filter_is_used="0"}}</div>
This block is an excellent solution to display the personal BIO of your team members. The block includes a profile image, title, and biography.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig
<div class="element bio"> <div class="item"> <div class="wrapper"> <img src="{{media url='wysiwyg/elements/argento/force/bio-1.png'}}" alt="" class="image"> <h4 class="title">Owen Hill</h4> <span class="subtitle">Head Designer</span> <p class="info">Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig</p> </div> </div> <div class="item"> <div class="wrapper"> <img src="{{media url='wysiwyg/elements/argento/force/bio-2.png'}}" alt="" class="image"> <h4 class="title">Angie Smith</h4> <span class="subtitle">Head Designer</span> <p class="info">Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig</p> </div> </div> <div class="item"> <div class="wrapper"> <img src="{{media url='wysiwyg/elements/argento/force/bio-3.png'}}" alt="" class="image"> <h4 class="title">Alice Richardson</h4> <span class="subtitle">Head Designer</span> <p class="info">Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet lig</p> </div> </div> </div>
With the block, you can add your own custom pricing table block. It shows the price range with combinations of different prices. It shows a list of services or products included in the pricing package. You have only to choose a location where you want to add the block.
<div class="element pricing"> <div class="block-content"> <div class="price-block"> <div class="info-top"> <span class="title">Starter Plan</span> </div> <div class="info-bottom"> <div class="price"><strong class="amount">$40</strong><span class="period">/month</span></div> <ul class="conditions"> <li class="item"><strong>1</strong> Complete product</li> <li class="item"><strong>1</strong> year of support</li> <li class="item"><strong>1</strong> Dedicated server</li> <li class="item"><strong>10</strong> Research demo</li> <li class="item"><strong>20</strong> users</li> </ul> <a href="" class="action primary"><span>Get Started</span></a> </div> </div> <div class="price-block popular"> <div class="info-top"> <span class="title">Business Plan</span> </div> <div class="info-bottom"> <div class="price"><strong class="amount">$60</strong><span class="period">/month</span></div> <ul class="conditions"> <li class="item"><strong>1</strong> Complete product</li> <li class="item"><strong>1</strong> year of support</li> <li class="item"><strong>1</strong> Dedicated server</li> <li class="item"><strong>10</strong> Research demo</li> <li class="item"><strong>20</strong> users</li> </ul> <a href="" class="action primary"><span>Get Started</span></a> </div> </div> <div class="price-block"> <div class="info-top"> <span class="title">Enterprise Plan</span> </div> <div class="info-bottom"> <div class="price"><strong class="amount">$80</strong><span class="period">/month</span></div> <ul class="conditions"> <li class="item"><strong>1</strong> Complete product</li> <li class="item"><strong>1</strong> year of support</li> <li class="item"><strong>1</strong> Dedicated server</li> <li class="item"><strong>10</strong> Research demo</li> <li class="item"><strong>20</strong> users</li> </ul> <a href="" class="action primary"><span>Get Started</span></a> </div> </div> </div> </div>
The Image Gallery block allows you to easily add an image gallery. It can be an image only or an image with the link. That will lead customers to the important pages of your store. The element is made using Lightbox Pro module widget with masonry grid gallery layout.
<div class="element gallery hero"> <div class="block-title"> <strong role="heading" aria-level="2">Gallery</strong> </div> <div class="content"> {{widget type="Swissup\Lightboxpro\Block\Widgets\Gallery" template="widget/masonry.phtml" img_width="600" img_height="auto" thumb_width="80" thumb_height="100" gallery="file=argento/force/1.jpg&position=0&label=Fitness+training;file=argento/force/2.jpg&position=1&label=Desert+bike;file=argento/force/3.jpg&position=2&label=Basketball;file=argento/force/4.jpg&position=3&label=Swimming;file=argento/force/5.jpg&position=4&label=Power+lifting;file=argento/force/6.jpg&position=5&label=Cycling+Marathon"}} </div> </div>
The Latest News block helps you to show recent posts from a blog, top trending news, videos, and stories. By default, the block displays 2 news items.
<div class="element news hero"> <div class="block-title"> <strong role="heading" aria-level="2">Latest news</strong> </div> <div class="content"> <ol class="post-list"> <li class="item"> <div class="post-image"> <a href="#" title="News post"> <img src="{{media url="wysiwyg/elements/argento/force/news1.jpg"}}" alt="Post Link"> </a> </div> <div class="post-content"> <span class="post-tag">Trends</span> <h2><a href="#" title="New Collection">New Collection</a></h2> <div class="short-description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Amet temporibus laborum id saepe esse repudiandae</div> <a href="#" class="read-more-link">Read more</a> </div> </li> <li class="item"> <div class="post-image"> <a href="#" title="News post"> <img src="{{media url="wysiwyg/elements/argento/force/news2.jpg"}}" alt="Post Link"> </a> </div> <div class="post-content"> <span class="post-tag">Trends</span> <h2><a href="#" title="New Collection">New Collection</a></h2> <div class="short-description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Amet temporibus laborum id saepe esse repudiandae</div> <a href="#" class="read-more-link">Read more</a> </div> </li> </ol> </div> </div>
The Testimonials widget allows you to add testimonials anywhere on your website. Using it you can embed customer testimonial slider into your store pages in a few clicks.
Rating100%Ottimo prodotto, spedizione velocissima. Grande store
12 December 2023
Rating100%Perfetto, ottimo prodotto.
9 May 2023
Rating100%Spedizione velocissima (il giorno dopo l'ordine) e prodotto esattamente come da descrizione. Ottima cerniera per il bimini della mia barca a vela
29 March 2023
Rating100%Conforme alle aspettative. Cura nell'imballaggio. Tempi di spedizione rispettati. Prodotto di immediato e semplice montaggio.
9 May 2023
Rating100%Comme ma première commande, parfait. Livraison rapide, produit au top.
15 November 2023
Rating100%Prodotto eccellente come da descrizione.
25 January 2023
<div class="element testimonials"> {{widget type="Swissup\Testimonials\Block\Widgets\Slider" items_number="6" title="Our clients love us" slides_to_show="3" show_rating="1"}} </div>
Ottimo venditore
10 May 2023
Buon prodotto
25 January 2023
Prodotto di ottima costruzione!
25 January 2023
Sono prodotti identici a quelli illustrati vanno bene è arrivano in pochi giorni ,sono rimasto soddisfatto.
29 April 2023
Tutto ok
10 May 2023
Comme pour les commandes précédentes, très bien, bon produit et envoi rapide,
25 January 2023
<div class="element testimonial-single"> {{widget type="Swissup\Testimonials\Block\Widgets\Slider" items_number="6" title="" slides_to_show="1" show_rating="0" img_width="349" img_height="394"}} </div>
We use necessary cookies to make our site work. We'd also like to set optional cookies to help us improve it. We won't set optional cookies unless you enable them. Using this tool will set a cookie on your device to remember your preferences.
I cookie necessari abilitano funzionalità di base come sicurezza, gestione della rete e accessibilità. È possibile disabilitarli modificando le impostazioni del browser, ma ciò potrebbe influire sul funzionamento del sito Web.
| Name | Description |
|---|---|
| PHPSESSID | Preserves the visitor's session state across page requests. |
| form_key | Protects visitor's data from Cross-Site Request Forgery Attacks. |
| guest-view | Stores the Order ID that guest shoppers use to retrieve their order status. Used in “Orders and Returns” widgets. |
| login_redirect | Preserves the destination page the customer was loading before being directed to log in. |
| mage-banners-cache-storage | Stores banner content locally to improve performance. |
| mage-cache-sessid | The value of this cookie triggers the cleanup of local cache storage. |
| mage-cache-storage | Local storage of visitor-specific content that enables ecommerce functions. |
| mage-cache-storage-section-invalidation | Forces local storage of specific content sections that should be invalidated. |
| mage-messages | Tracks error messages and other notifications that are shown to the user, such as the cookie consent message, and various error messages. The message is deleted from the cookie after it is shown to the shopper. |
| private_content_version | Appends a random, unique number and time to pages with customer content to prevent them from being cached on the server. |
| section_data_ids | Stores customer-specific information related to shopper-initiated actions such as display wish list, checkout information, etc. |
| user_allowed_save_cookie, cookie_consent |
Stores the user's cookie consent state for the current domain. |
| X-Magento-Vary | Configuration setting that improves performance when using Varnish static content caching. |
Preference cookies are used to store settings and information that changes the website look and functionality.
| Name | Description |
|---|---|
| store | Remembers the user's selected language version of a website. |
I cookie di marketing ci aiutano a fornire ai nostri visitatori contenuti pertinenti, cronologia di navigazione e consigli sui prodotti.
| Name | Description |
|---|---|
| product_data_storage | Stores configuration for product data related to Recently Viewed / Compared Products. |
| recently_compared_product | Stores product IDs of recently compared products. |
| recently_compared_product_previous | Stores product IDs of previously compared products for easy navigation. |
| recently_viewed_product | Stores product IDs of recently viewed products for easy navigation. |
| recently_viewed_product_previous | Stores product IDs of recently previously viewed products for easy navigation. |
I cookie pubblicitari ci aiutano a fornire ai nostri visitatori annunci e campagne di marketing pertinenti.
| Name | Description |
|---|---|
| easybanner | Preserves the visitor's preferences and stats regarding shown popup blocks. |
| _fbp | Pubblico simile di Facebook (Meta Platforms Ireland Limited) è un servizio di advertising e di targeting comportamentale fornito da Meta Platforms Ireland Limited che utilizza i Dati raccolti attraverso il servizio Pubblico personalizzato di Facebook al fine di mostrare annunci pubblicitari a Utenti con comportamenti simili a Utenti che sono già in una lista di Pubblico personalizzato sulla base del loro precedente utilizzo di shop.quadernodiviaggio.com/ o della loro interazione con contenuti rilevanti attraverso le applicazioni e i servizi di Facebook. Sulla base di questi Dati, gli annunci personalizzati saranno mostrati agli Utenti suggeriti da Pubblico simile di Facebook. Gli Utenti possono scegliere di non utilizzare i Strumenti di Tracciamento di Facebook per la personalizzazione degli annunci visitando questa pagina di opt-out . Dati Personali trattati: Dati di utilizzo e Strumenti di Tracciamento. Luogo del trattamento: Irlanda – Privacy Policy – Opt Out. |
| _gac_* | Contains campaign-related information for the user. Google AdWords conversion tags read this cookie if Google Analytics is linked to your AdWords account. |
I cookie analitici ci aiutano a capire come i nostri visitatori interagiscono con il sito web. Ci aiuta a capire il numero di visitatori, da dove provengono i visitatori e le pagine che navigano. I cookie raccolgono questi dati e sono riportati in forma anonima.
| Name | Description |
|---|---|
| add_to_cart | |
| add_to_cart, remove_from_cart |
Used by Google Tag Manager. Captures the product SKU, name, price and quantity added or removed from the cart, and makes the information available for future integration by third-party scripts. |
| dc_gtm_* | Throttles request rate when Google Analytics is deployed with Google Tag Manager. |
| ssupp.vid - ssupp.visits | Smartsupp (Smartsupp.com, s.r.o.) Il Widget di Smartsupp è un servizio di interazione con la piattaforma di live chat e di registrazione delle sessioni Smartsupp, fornito da Smartsupp.com, s.r.o. Dati Personali trattati: Dati comunicati durante l'utilizzo del servizio, Dati di utilizzo, Strumento di Tracciamento, varie tipologie di Dati secondo quanto specificato dalla privacy policy del servizio e Video. Luogo del trattamento: Repubblica Ceca |
| _fr | Monitoraggio conversioni di Facebook Ads (pixel di Facebook) (Meta Platforms Ireland Limited) è un servizio di statistiche fornito da Meta Platforms Ireland Limited che collega i dati provenienti dal network di annunci Meta con le azioni compiute all'interno di shop.quadernodiviaggio.com/. Il pixel di Facebook monitora le conversioni che possono essere attribuite alle inserzioni di Facebook, Instagram e Audience Network. Dati Personali trattati: Dati di utilizzo e Strumenti di Tracciamento. Luogo del trattamento: Irlanda – Privacy Policy. |
| _ga, _gat, _gid, _ga_*, _gat_* |
This cookie is installed by Google Analytics. They are used to collect information about how visitors use our website. We use the information to compile reports and to help us improve the website. The cookies collect information in a way that does not directly identify anyone. |
