📁 Détails du thème : theme_loftspace
🧬 Lancer la duplication
🎨 Galerie d’images du thème
Ouvrir la galerie
Visualisez toutes les images disponibles dans
static/src/img
pour le thème theme_loftspace.
Cliquez sur une vignette pour voir l’image en taille réelle.
🧩 Snippets personnalisés
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template name="Media List" id="s_media_list"> <section class="s_media_list pt32 pb32 o_cc o_cc2" data-vcss="001"> <div class="container"> <div class="row s_nb_column_fixed s_col_no_bgcolor"> <div class="col-lg-12 s_media_list_item pt16 pb16" data-name="Media item"> <div class="row s_col_no_resize s_col_no_bgcolor g-0 align-items-center o_cc o_cc1"> <div class="col-lg-4 align-self-stretch s_media_list_img_wrapper"> <img src="/web/image/website.s_media_list_default_image_1" class="s_media_list_img h-100 w-100" alt=""/> </div> <div class="col-lg-8 s_media_list_body"> <h3>Media heading</h3> <p>Use this snippet to build various types of components that feature a left- or right-aligned image alongside textual content. Duplicate the element to create a list that fits your needs.</p> <a href="#" class="btn btn-primary mb-2">Discover</a> </div> </div> </div> <div class="col-lg-12 s_media_list_item pt16 pb16" data-name="Media item"> <div class="row s_col_no_resize s_col_no_bgcolor g-0 align-items-center o_cc o_cc1"> <div class="col-lg-4 align-self-stretch s_media_list_img_wrapper"> <img src="/web/image/website.s_media_list_default_image_2" class="s_media_list_img h-100 w-100" alt=""/> </div> <div class="col-lg-8 s_media_list_body"> <h3>Event heading</h3> <p>Speakers from all over the world will join our experts to give inspiring talks on various topics. Stay on top of the latest business management trends & technologies</p> </div> </div> </div> <div class="col-lg-12 s_media_list_item pt16 pb16" data-name="Media item"> <div class="row s_col_no_resize s_col_no_bgcolor g-0 align-items-center o_cc o_cc1"> <div class="col-lg-4 align-self-stretch s_media_list_img_wrapper"> <img src="/web/image/website.s_media_list_default_image_3" class="s_media_list_img h-100 w-100" alt=""/> </div> <div class="col-lg-8 s_media_list_body"> <h3>Post heading</h3> <p>Use this component for creating a list of featured elements to which you want to bring attention.</p> <a href="#"> Continue reading <i class="fa fa-long-arrow-right align-middle ms-1"/> </a> </div> </div> </div> </div> </div> </section> </template> <template id="s_media_list_options" inherit_id="website.snippet_options"> <xpath expr="//t[@t-call='website.snippet_options_background_options']" position="before"> <div data-js="MultipleItems" data-selector=".s_media_list"> <we-row string="Media"> <we-button data-add-item="" data-item=".s_media_list_item:last" data-select-item="" data-no-preview="true" class="o_we_bg_brand_primary"> Add Media </we-button> </we-row> </div> </xpath> <xpath expr="." position="inside"> <t t-call="website.snippet_options_background_options"> <t t-set="selector" t-value="'.s_media_list_item'"/> <t t-set="target" t-value="'> .row'"/> <t t-set="with_colors" t-value="True"/> <t t-set="with_images" t-value="False"/> <t t-set="with_color_combinations" t-value="True"/> <t t-set="with_gradients" t-value="True"/> </t> <div data-js="Box" data-selector=".s_media_list_item" data-target="> .row"> <t t-call="website.snippet_options_border_widgets"/> <t t-call="website.snippet_options_shadow_widgets"/> </div> <div data-selector=".s_media_list_item" data-target="> .row"> <we-button-group string="Layout"> <we-button title="Left" data-name="media_left_opt" data-select-class="" data-img="/website/static/src/img/snippets_options/image_left.svg"/> <we-button title="Right" data-select-class="flex-row-reverse" data-img="/website/static/src/img/snippets_options/image_right.svg"/> </we-button-group> </div> <div data-js="MediaItemLayout" data-selector=".s_media_list_item"> <we-button-group string="Image Size" data-dependencies="media_left_opt"> <we-button data-layout="3" data-img="/website/static/src/img/snippets_options/media_layout_1_4.svg" title="1/4 - 3/4"/> <we-button data-layout="4" data-img="/website/static/src/img/snippets_options/media_layout_1_3.svg" title="1/3 - 2/3"/> <we-button data-layout="6" data-img="/website/static/src/img/snippets_options/media_layout_1_2.svg" title="1/2 - 1/2"/> </we-button-group> <we-button-group string="Image Size" data-dependencies="!media_left_opt"> <we-button data-layout="3" data-img="/website/static/src/img/snippets_options/media_layout_1_4_right.svg" title="1/4 - 3/4"/> <we-button data-layout="4" data-img="/website/static/src/img/snippets_options/media_layout_1_3_right.svg" title="1/3 - 2/3"/> <we-button data-layout="6" data-img="/website/static/src/img/snippets_options/media_layout_1_2_right.svg" title="1/2 - 1/2"/> </we-button-group> </div> <div data-selector=".s_media_list_item" data-target="> .row"> <!-- Don't use the standard Vert. Alignement option to not suggest Equal Height, which is useless for this snippet. --> <we-button-group string="Text Position" title="Text Position" data-dependencies="media_left_opt"> <we-button title="Align Top" data-select-class="align-items-start" data-img="/website/static/src/img/snippets_options/align_top_right.svg"/> <we-button title="Align Middle" data-select-class="align-items-center" data-img="/website/static/src/img/snippets_options/align_middle_right.svg"/> <we-button title="Align Bottom" data-select-class="align-items-end" data-img="/website/static/src/img/snippets_options/align_bottom_right.svg"/> </we-button-group> <we-button-group string="Text Position" title="Text Position" data-dependencies="!media_left_opt"> <we-button title="Align Top" data-select-class="align-items-start" data-img="/website/static/src/img/snippets_options/align_top.svg"/> <we-button title="Align Middle" data-select-class="align-items-center" data-img="/website/static/src/img/snippets_options/align_middle.svg"/> <we-button title="Align Bottom" data-select-class="align-items-end" data-img="/website/static/src/img/snippets_options/align_bottom.svg"/> </we-button-group> </div> </xpath> </template> <record id="website.s_media_list_000_scss" model="ir.asset"> <field name="name">Media list 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_media_list/000.scss</field> <field name="active" eval="False"/> </record> <record id="website.s_media_list_001_scss" model="ir.asset"> <field name="name">Media list 001 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_media_list/001.scss</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_product_catalog" name="Pricelist"> <section class="s_product_catalog oe_img_bg o_bg_img_center oe_custom_bg pt48 pb32" style="background-image: url('/web/image/website.s_product_catalog_default_image');" data-vcss="001"> <div class="container"> <h2>Menu</h2> <p>Add a menu description.</p> <div class="row"> <div class="col-lg-6 pt16 pb16"> <h3>Starter</h3> <ul class="list-unstyled my-3"> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Cheese Onion Rings</t> <t t-set="price">$9.00</t> </t> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Chefs Fresh Soup of the Day</t> <t t-set="price">$7.50</t> </t> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Beef Carpaccio</t> <t t-set="price">$10.50</t> </t> </ul> </div> <div class="col-lg-6 pt16 pb16"> <h3>Main Course</h3> <ul class="list-unstyled my-3"> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Filet Mignon 8oz</t> <t t-set="price">$15.50</t> </t> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Farm Friendly Chicken Supreme</t> <t t-set="price">$15.50</t> </t> <t t-call="website.s_product_catalog_dish"> <t t-set="name">Tuna and Salmon Burger</t> <t t-set="price">$12.00</t> </t> </ul> </div> </div> </div> </section> </template> <template id="s_product_catalog_dish"> <li class="s_product_catalog_dish" data-name="Product"> <p class="s_product_catalog_dish_title d-flex align-items-baseline pb-2"> <span t-esc="name" class="s_product_catalog_dish_name s_product_catalog_dish_dot_leaders"/> <span t-esc="price" class="s_product_catalog_dish_price ms-auto ps-2"/> </p> </li> </template> <template id="s_product_catalog_add_product_widget"> <we-row string="Product"> <we-button data-add-item="" data-item=".s_product_catalog_dish:last" data-select-item="" t-att-data-apply-to="apply_to" data-no-preview="true" class="o_we_bg_brand_primary"> Add Product </we-button> </we-row> </template> <template id="s_product_catalog_options" inherit_id="website.snippet_options"> <xpath expr="//t[@t-call='website.snippet_options_background_options']" position="before"> <div data-js="MultipleItems" data-selector=".s_product_catalog"> <t t-call="website.s_product_catalog_add_product_widget"> <t t-set="apply_to" t-valuef="> :has(.s_product_catalog_dish):not(:has(.row > div:has(.s_product_catalog_dish)))"/> </t> </div> <div data-js="MultipleItems" data-selector=".s_product_catalog .row > div"> <t t-call="website.s_product_catalog_add_product_widget"> <t t-set="apply_to" t-valuef="> :has(.s_product_catalog_dish)"/> </t> </div> </xpath> <xpath expr="." position="inside"> <div data-js="ProductCatalog" data-selector=".s_product_catalog"> <we-checkbox string="Descriptions" data-toggle-description="true" data-no-preview="true"/> <t t-call="website.snippet_options_border_line_widgets"> <t t-set="label">⌙ Separator</t> <t t-set="direction" t-value="'top'"/> <t t-set="apply_to" t-value="'.s_product_catalog_dish_description'"/> <!-- Note: no need of extra dependency thanks to the apply-to --> </t> </div> <div data-selector=".s_product_catalog_dish" data-drop-near=".s_product_catalog_dish"/> </xpath> <xpath expr="//div[@data-js='SnippetMove']" position="attributes"> <attribute name="data-selector" add=".s_product_catalog_dish" separator=","/> </xpath> </template> <record id="website.s_product_catalog_001_scss" model="ir.asset"> <field name="name">Product catalog 001 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_product_catalog/001.scss</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template name="Numbers" id="s_numbers"> <section class="s_numbers o_cc o_cc2 pt24 pb24"> <div class="container"> <div class="row"> <div class="col-lg-3 text-center pt24 pb24"> <span class="s_number display-4">12</span> <h6>Useful options</h6> </div> <div class="col-lg-3 text-center pt24 pb24"> <span class="s_number display-4">45</span> <h6>Beautiful snippets</h6> </div> <div class="col-lg-3 text-center pt24 pb24"> <span class="s_number display-4">8</span> <h6>Amazing pages</h6> </div> <div class="col-lg-3 text-center pt24 pb24"> <span class="s_number display-4">37</span> <h6>Outstanding images</h6> </div> </div> </div> </section> </template> <!-- No associated CSS but there is some in theme overrides --> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_title" name="Title"> <section class="s_title pt40 pb40" data-vcss="001"> <div class="container s_allow_columns"> <h1 style="text-align: center;"> <font style="font-size: 62px;">Your Site Title</font> </h1> </div> </section> </template> <record id="website.s_title_000_scss" model="ir.asset"> <field name="name">Title 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_title/000.scss</field> <field name="active" eval="False"/> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_image_text" name="Image - Text"> <section class="s_text_image pt32 pb32"> <div class="container"> <div class="row align-items-center"> <div class="col-lg-6 pt16 pb16"> <img src="/web/image/website.s_image_text_default_image" class="img img-fluid mx-auto" alt=""/> </div> <div class="col-lg-6 pt16 pb16"> <h2>Section Subtitle</h2> <p>Write one or two paragraphs describing your product or services. To be successful your content needs to be useful to your readers.</p> <p>Start with the customer – find out what they want and give it to them.</p> <p> <a href="#" class="btn btn-primary mb-2">Discover more</a> </p> </div> </div> </div> </section> </template> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_cover" name="Cover"> <section class="s_cover parallax s_parallax_is_fixed bg-black-50 pt96 pb96" data-scroll-background-ratio="1"> <span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_cover_default_image'); background-position: 50% 0;"/> <div class="o_we_bg_filter bg-black-50"/> <div class="container s_allow_columns"> <h1 style="text-align: center;"> <font style="font-size: 62px; font-weight: bold;">Catchy Headline</font> </h1> <p class="lead" style="text-align: center;"> Write one or two paragraphs describing your product, services or a specific feature. <br/> To be successful your content needs to be useful to your readers. </p> <p style="text-align: center;"> <a t-att-href="cta_btn_href" class="btn btn-primary mb-2"> <t t-esc="cta_btn_text">Contact us</t> </a> </p> </div> </section> </template> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_comparisons" name="Comparisons"> <section class="s_comparisons pt32 pb32"> <div class="container"> <div class="row"> <div class="col-lg-4 s_col_no_bgcolor text-center pt32 pb16" data-name="Box"> <div class="card bg-200"> <h4 class="card-header">Beginner</h4> <div class="card-body text-center"> <h2 class="card-title"> <span class="s_comparisons_currency">$</span> <span class="s_comparisons_price"> <b>35</b> </span> <span class="s_comparisons_decimal">.00</span> </h2> <small>/ month</small> </div> <ul class="list-group list-group-flush"> <li class="list-group-item">Basic sales & marketing for up to 2 users</li> <li class="list-group-item">Account & Sales management</li> <li class="list-group-item">No customization</li> <li class="list-group-item">No support</li> </ul> <div class="card-footer"> <p> <i>Instant setup, satisfied or reimbursed.</i> </p> <a href="/contactus" class="btn btn-primary mb-2">Order now</a> </div> </div> </div> <div class="col-lg-4 s_col_no_bgcolor text-center pt32 pb16" data-name="Box"> <div class="card bg-o-color-5"> <h4 class="card-header">Professional</h4> <div class="card-body"> <h2 class="card-title"> <span class="s_comparisons_currency">$</span> <span class="s_comparisons_price"> <b>65</b> </span> <span class="s_comparisons_decimal">.00</span> </h2> <small>/ month</small> </div> <ul class="list-group list-group-flush"> <li class="list-group-item">Complete CRM for any size team</li> <li class="list-group-item">Get access to all modules</li> <li class="list-group-item">Limited customization</li> <li class="list-group-item">Email support</li> </ul> <div class="card-footer"> <p> <i>Instant setup, satisfied or reimbursed.</i> </p> <a href="/contactus" class="btn btn-primary mb-2">Start now</a> </div> </div> </div> <div class="col-lg-4 s_col_no_bgcolor text-center pt32 pb16" data-name="Box"> <div class="card bg-secondary"> <h4 class="card-header">Expert</h4> <div class="card-body text-center"> <h2 class="card-title"> <span class="s_comparisons_currency">$</span> <span class="s_comparisons_price"> <b>125</b> </span> <span class="s_comparisons_decimal">.00</span> </h2> <small>/ month</small> </div> <ul class="list-group list-group-flush"> <li class="list-group-item">Unlimited CRM power and support</li> <li class="list-group-item">Get access to all modules and features</li> <li class="list-group-item">Unlimited customization</li> <li class="list-group-item">24x7 toll-free support</li> </ul> <div class="card-footer"> <p> <i>Instant setup, satisfied or reimbursed.</i> </p> <a href="/contactus" class="btn btn-primary mb-2">Contact us</a> </div> </div> </div> </div> </div> </section> </template> <record id="website.s_comparisons_000_scss" model="ir.asset"> <field name="name">Comparisons 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_comparisons/000.scss</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_features_grid" name="Features Grid"> <section class="s_features_grid pt48 pb24"> <div class="container"> <div class="row"> <div class="col-lg-6 s_col_no_bgcolor pb24"> <div class="row"> <div class="col-lg-12 pb24" data-name="Box"> <h2>First list of Features</h2> <h5>Add a great slogan.</h5> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-font-awesome rounded-circle bg-primary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Change Icons</h4> <p>Double click an icon to replace it with one of your choice.</p> </div> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-files-o rounded-circle bg-primary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Duplicate</h4> <p>Duplicate blocks and columns to add more features.</p> </div> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-trash rounded-circle bg-primary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Delete Blocks</h4> <p>Select and delete blocks to remove features.</p> </div> </div> </div> </div> <div class="col-lg-6 s_col_no_bgcolor pb24"> <div class="row"> <div class="col-lg-12 pb24" data-name="Box"> <h2>Second list of Features</h2> <h5>Add a great slogan.</h5> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-magic rounded bg-secondary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Great Value</h4> <p>Turn every feature into a benefit for your reader.</p> </div> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-eyedropper rounded bg-secondary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Edit Styles</h4> <p>You can edit colors and backgrounds to highlight features.</p> </div> </div> <div class="col-lg-12 pt16 pb16" data-name="Box"> <i class="fa fa-2x fa-picture-o rounded bg-secondary s_features_grid_icon"/> <div class="s_features_grid_content"> <h4>Sample Icons</h4> <p>All these icons are completely free for commercial use.</p> </div> </div> </div> </div> </div> </div> </section> </template> <record id="website.s_features_grid_000_scss" model="ir.asset"> <field name="name">Features grid 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_features_grid/000.scss</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_text_image" name="Text - Image"> <section class="s_text_image pt32 pb32"> <div class="container"> <div class="row align-items-center"> <div class="col-lg-6 pt16 pb16"> <h2>A Section Subtitle</h2> <p>Write one or two paragraphs describing your product or services. To be successful your content needs to be useful to your readers.</p> <p>Start with the customer – find out what they want and give it to them.</p> <p> <a href="#" class="btn btn-primary mb-2">Learn more</a> </p> </div> <div class="col-lg-6 pt16 pb16"> <img src="/web/image/website.s_text_image_default_image" class="img img-fluid mx-auto" alt=""/> </div> </div> </div> </section> </template> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_image_gallery" name="Image Gallery"> <section class="s_image_gallery o_slideshow s_image_gallery_show_indicators s_image_gallery_indicators_rounded pt24" data-vcss="001" data-columns="3" style="height: 500px; overflow: hidden;"> <div class="container"> <div id="slideshow_sample" class="carousel slide" data-bs-ride="carousel" data-bs-interval="0" style="margin: 0 12px;"> <div class="carousel-inner" style="padding: 0;"> <div class="carousel-item active"> <img class="img img-fluid d-block" src="/web/image/website.library_image_08" data-name="Image" data-index="0"/> </div> <div class="carousel-item"> <img class="img img-fluid d-block" src="/web/image/website.library_image_03" data-name="Image" data-index="1"/> </div> <div class="carousel-item"> <img class="img img-fluid d-block" src="/web/image/website.library_image_02" data-name="Image" data-index="2"/> </div> </div> <ul class="carousel-indicators"> <li class="o_indicators_left text-center d-none" aria-label="Previous" title="Previous"> <i class="fa fa-chevron-left"/> </li> <li data-bs-target="#slideshow_sample" data-bs-slide-to="0" style="background-image: url(/web/image/website.library_image_08)" class="active"/> <li data-bs-target="#slideshow_sample" data-bs-slide-to="1" style="background-image: url(/web/image/website.library_image_03)"/> <li data-bs-target="#slideshow_sample" data-bs-slide-to="2" style="background-image: url(/web/image/website.library_image_02)"/> <li class="o_indicators_right text-center d-none" aria-label="Next" title="Next"> <i class="fa fa-chevron-right"/> </li> </ul> <a class="carousel-control-prev o_we_no_overlay o_not_editable" href="#slideshow_sample" data-bs-slide="prev" aria-label="Previous" title="Previous"> <span class="fa fa-chevron-left fa-2x text-white"/> <span class="visually-hidden">Previous</span> </a> <a class="carousel-control-next o_we_no_overlay o_not_editable" href="#slideshow_sample" data-bs-slide="next" aria-label="Next" title="Next"> <span class="fa fa-chevron-right fa-2x text-white"/> <span class="visually-hidden">Next</span> </a> </div> </div> </section> </template> <template id="s_images_wall" name="Images Wall"> <section class="s_image_gallery o_spc-small o_masonry pt24 pb24" data-vcss="001" data-columns="3" style="overflow: hidden;"> <div class="container"> <div class="row s_nb_column_fixed"> <div class="o_masonry_col o_snippet_not_selectable col-lg-4"> <img class="img img-fluid d-block" src="/web/image/website.library_image_03" data-index="0" data-name="Image"/> <img class="img img-fluid d-block" src="/web/image/website.library_image_10" data-index="3" data-name="Image"/> </div> <div class="o_masonry_col o_snippet_not_selectable col-lg-4"> <img class="img img-fluid d-block" src="/web/image/website.library_image_13" data-index="1" data-name="Image"/> <img class="img img-fluid d-block" src="/web/image/website.library_image_05" data-index="4" data-name="Image"/> </div> <div class="o_masonry_col o_snippet_not_selectable col-lg-4"> <img class="img img-fluid d-block" src="/web/image/website.library_image_14" data-index="2" data-name="Image"/> <img class="img img-fluid d-block" src="/web/image/website.library_image_16" data-index="5" data-name="Image"/> </div> </div> </div> </section> </template> <template id="s_image_gallery_options" inherit_id="website.snippet_options"> <xpath expr="//t[@t-call='website.snippet_options_background_options']" position="before"> <div data-js="gallery" data-selector=".s_image_gallery"> <we-row string="Images"> <we-button class="o_we_bg_success" data-add-images="true" data-no-preview="true">Add</we-button> <we-button class="o_we_bg_danger" data-remove-all-images="true" data-no-preview="true">Remove all</we-button> </we-row> </div> </xpath> <xpath expr="." position="inside"> <div data-js="gallery" data-selector=".s_image_gallery"> <we-select string="Mode" data-dependencies="!slideshow_mode_opt"> <we-button data-mode="grid" data-name="grid_mode_opt">Grid</we-button> <we-button data-mode="masonry" data-name="masonry_mode_opt">Masonry</we-button> <we-button data-mode="nomode">Float</we-button> <!-- Hidden option --> <we-button data-mode="slideshow" data-name="slideshow_mode_opt">Slideshow</we-button> </we-select> <!-- TODO adapt in master: this was patched in JS to replace data-attribute-name="interval" by data-attribute-name="bsInterval" in order to be consistent with Bootstrap 5. --> <we-input string="Speed" data-dependencies="slideshow_mode_opt" data-apply-to=".carousel:first" data-select-data-attribute="0s" data-attribute-name="interval" data-unit="s" data-save-unit="ms" data-step="0.1"/> <we-select string="Columns" data-dependencies="masonry_mode_opt, grid_mode_opt"> <we-button data-columns="1">1</we-button> <we-button data-columns="2">2</we-button> <we-button data-columns="3">3</we-button> <we-button data-columns="4">4</we-button> <we-button data-columns="6">6</we-button> <we-button data-columns="12">12</we-button> </we-select> <we-range string="Images Spacing" data-dependencies="!slideshow_mode_opt" data-select-class="o_spc-none|o_spc-small|o_spc-medium|o_spc-big"/> <we-select string="Styling" data-apply-to="img"> <we-button data-select-class="">Standard</we-button> <we-button data-select-class="img-thumbnail">Thumbnails</we-button> <we-button data-select-class="rounded-pill">Circle</we-button> <we-button data-select-class="shadow">Shadows</we-button> </we-select> <we-select string="Arrows" data-dependencies="slideshow_mode_opt"> <we-button data-select-class="">Standard</we-button> <we-button data-select-class="s_image_gallery_indicators_arrows_boxed">Boxed</we-button> <we-button data-select-class="s_image_gallery_indicators_arrows_rounded">Rounded</we-button> </we-select> <we-checkbox string="Image Cover" data-select-class="s_image_gallery_cover" data-dependencies="slideshow_mode_opt"/> <we-select string="Indicators" data-dependencies="slideshow_mode_opt"> <we-button data-select-class="">None</we-button> <we-button data-select-class="s_image_gallery_show_indicators s_image_gallery_indicators_dots">Dots</we-button> <we-button data-select-class="s_image_gallery_show_indicators">Squared Miniatures</we-button> <we-button data-select-class="s_image_gallery_show_indicators s_image_gallery_indicators_rounded">Rounded Miniatures</we-button> </we-select> <t t-call="website.snippet_options_border_widgets"> <t t-set="apply_to" t-valuef="img"/> <t t-set="so_rounded_no_dependencies" t-value="true"/> </t> </div> <div data-js="gallery_img" data-selector=".s_image_gallery img"> <we-row string="Re-order" data-no-preview="true"> <we-button class="fa fa-fw fa-angle-double-left" title="Move to first" data-position="first"/> <we-button class="fa fa-fw fa-angle-left" title="Move to previous" data-position="prev"/> <we-button class="fa fa-fw fa-angle-right" title="Move to next" data-position="next"/> <we-button class="fa fa-fw fa-angle-double-right" title="Move to last" data-position="last"/> </we-row> </div> </xpath> </template> <record id="website.s_image_gallery_000_js" model="ir.asset"> <field name="name">Image gallery 000 JS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_image_gallery/000.js</field> </record> <record id="website.s_image_gallery_000_scss" model="ir.asset"> <field name="name">Image gallery 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_image_gallery/000.scss</field> <field name="active" eval="False"/> </record> <record id="website.s_image_gallery_001_scss" model="ir.asset"> <field name="name">Image gallery 001 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_image_gallery/001.scss</field> </record> <record id="website.s_image_gallery_000_xml" model="ir.asset"> <field name="name">Image gallery 000 XML</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_image_gallery/000.xml</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_features" name="Features"> <section class="s_features pt32 pb32"> <div class="container"> <div class="row"> <div class="col-lg-4 pt32 pb32 text-center"> <i class="fa fa-3x fa-gear rounded bg-primary m-3"/> <h3>First Feature</h3> <p> Tell what's the value for the <br/> customer for this feature. </p> </div> <div class="col-lg-4 pt32 pb32 text-center"> <i class="fa fa-3x fa-photo rounded bg-o-color-5 m-3"/> <h3>Second Feature</h3> <p> Write what the customer would like to know, <br/> not what you want to show. </p> </div> <div class="col-lg-4 pt32 pb32 text-center"> <i class="fa fa-3x fa-leaf rounded bg-secondary m-3"/> <h3>Third Feature</h3> <p> A small explanation of this great <br/> feature, in clear words. </p> </div> </div> </div> </section> </template> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template name="Big Boxes" id="s_color_blocks_2"> <section class="s_color_blocks_2"> <div class="container-fluid"> <div class="row"> <div class="col-lg-6 o_cc o_cc3 text-center"> <i class="fa fa-shield fa-5x m-3"/> <h2>A color block</h2> <p> Color blocks are a simple and effective way to <b>present and highlight your content</b> . Choose an image or a color for the background. You can even resize and duplicate the blocks to create your own layout. Add images or icons to customize the blocks. </p> <a href="#" class="btn btn-primary mb-2">More Details</a> </div> <div class="col-lg-6 o_cc o_cc5 text-center"> <i class="fa fa-cube fa-5x m-3"/> <h2>Another color block</h2> <p> Color blocks are a simple and effective way to <b>present and highlight your content</b> . Choose an image or a color for the background. You can even resize and duplicate the blocks to create your own layout. Add images or icons to customize the blocks. </p> <a href="#" class="btn btn-primary mb-2">More Details</a> </div> </div> </div> </section> </template> <record id="website.s_color_blocks_2_000_scss" model="ir.asset"> <field name="name">Color blocks 2 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_color_blocks_2/000.scss</field> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_three_columns_moulat_lhout" inherit_id="website.s_three_columns" name="Moulat Lhout – 3 colonnes"> <!-- Première colonne --> <xpath expr="//div[hasclass('col-lg-4')][1]" position="replace"> <div class="col-lg-4 text-center"> <img src="/theme_poissonnerie/static/src/img/moulatlhout_boutique-02.jpg" class="img-fluid rounded mb-3" alt="Notre boutique Moulat Lhout"/> <h4 class="fw-bold">Notre Boutique</h4> <p>Un espace accueillant où tradition et fraîcheur se rencontrent pour offrir le meilleur des produits de la mer.</p> </div> </xpath> <!-- Deuxième colonne --> <xpath expr="//div[hasclass('col-lg-4')][2]" position="replace"> <div class="col-lg-4 text-center"> <img src="/theme_poissonnerie/static/src/img/fatiha_boutique-02.jpg" class="img-fluid rounded mb-3" alt="Notre Bastila maison"/> <h4 class="fw-bold">Bastila aux fruits de mer</h4> <p>Une bastila délicatement feuilletée, garnie de fruits de mer frais et parfumée aux épices marocaines : un vrai régal.</p> </div> </xpath> <!-- Troisième colonne --> <xpath expr="//div[hasclass('col-lg-4')][3]" position="replace"> <div class="col-lg-4 text-center"> <img src="/theme_poissonnerie/static/src/img/fatiha_houta-01.jpg" class="img-fluid rounded mb-3" alt="Poisson frais Moulat Lhout"/> <h4 class="fw-bold">Poissons Frais</h4> <p>Chaque jour, une sélection des meilleurs poissons fraîchement débarqués pour satisfaire toutes vos envies marines.</p> </div> </xpath> </template> <record id="website.s_three_columns_000_scss" model="ir.asset"> <field name="name">Three columns 000 SCSS</field> <field name="bundle">web.assets_frontend</field> <field name="path">website/static/src/snippets/s_three_columns/000.scss</field> <field name="active" eval="False"/> </record> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_call_to_action" name="Call to Action"> <section class="s_call_to_action o_cc o_cc3 pt48 pb24"> <div class="container"> <div class="row"> <div class="col-lg-9 pb16"> <h3> <b>50,000+ companies</b> run Odoo to grow their businesses. </h3> <p>Join us and make your company a better place.</p> </div> <div class="col-lg-3 pt8"> <p style="text-align: right;"> <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg mb-2"> <t t-esc="cta_btn_text">Contact us</t> </a> </p> </div> </div> </div> </section> </template> </odoo>
📝 Édition directe du snippet personnalisé
<?xml version="1.0" ?> <odoo> <template id="s_banner" name="Banner"> <section class="s_banner parallax s_parallax_is_fixed pt96 pb96" data-scroll-background-ratio="1"> <span class="s_parallax_bg oe_img_bg" style="background-image: url('/web/image/website.s_banner_default_image'); background-position: 50% 0;"/> <div class="container"> <div class="row s_nb_column_fixed"> <div class="col-lg-6 jumbotron rounded o_cc o_cc1 pt32 pb32" data-name="Box"> <h1> <font style="font-size: 62px;">Sell Online. Easily.</font> </h1> <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p> <a t-att-href="cta_btn_href" class="btn btn-primary mb-2"> <t t-esc="cta_btn_text">Contact Us</t> </a> </div> </div> </div> </section> </template> </odoo>
📂 Fichiers du thème
-
📁 models
-
📁 __pycache__
-
📁 data
-
📁 static
-
📁 src
-
📁 img
-
📁 snippets
-
📁 js
-
📁 old_snippets
-
📁 s_features_carousel
-
📁 s_banner_parallax
-
📁 s_products_carousel
-
-
-
📁 __pycache__
← Retour à la galerie