Custom Modal-Window / Promo-Window

Dear XTEMOS-team,

does “basel” support custom modal windows/promo windows? is here a css class for this?
in the theme you made a “promo window” and its great.
But i want to open href links in a new modal with the same functionality (JS) like your promo window.

thank you a lot!

and a second question: Where or in which template can i change de “size quide” svg icon?

Hi,

Our theme uses “Magnific popup” library and you can use its JS methods to create your own custom popups http://dimsemenov.com/plugins/magnific-popup/documentation.html
The size guide icon is located in the folder basel/images/svg/size-quide-icon.svg.

Hey, thanks for the fast support!

You are welcome! Feel free to contact us if you will have any extra questions.

Dear XTEMOS team,
one more question on the icon subject.

When i put the new icon in the same folder as your link ” basel/images/svg/size-quide-icon.svg.”, it will be lost on updates, right?
I´ve included the icon to the child-theme but it doesnt work and your standard theme-icon still exists. what am i doing wrong?

Thank you for advise!

Sorry, but you can’t simply replace it in the child theme as it works with default WordPress template files. Try to add the following PHP code snippet to the child theme functions.php file

    function basel_sguide_display_table_template( $sguide_post, $size_tables ){
        $is_quick_view = basel_loop_prop( 'is_quick_view' );
        
        if ( !basel_get_opt( 'size_guides' ) || $is_quick_view || !$size_tables || !$sguide_post ) return;
        
        $sguide_custom_css = get_post_meta( $sguide_post->ID, '_wpb_shortcodes_custom_css', true );
        $show_table = get_post_meta( $sguide_post->ID, 'basel_sguide_hide_table' );
        $show_table = isset( $show_table[0] ) ? $show_table[0] : 'show';
        ?>
            <?php if ( ! empty( $sguide_custom_css ) ): ?>
                <style type="text/css" data-type="vc_shortcodes-custom-css">
                    <?php echo $sguide_custom_css; ?>
                </style>
            <?php endif ?>
            <div id="basel_sizeguide" class="mfp-with-anim basel-content-popup mfp-hide basel-sizeguide">
                <h4 class="basel-sizeguide-title"><?php echo esc_html( $sguide_post->post_title ); ?></h4>
                <div class="basel-sizeguide-content"><?php echo do_shortcode( $sguide_post->post_content ); ?></div>
                <?php if ( $show_table == 'show' ): ?>
                    <div class="responsive-table">
                        <table class="basel-sizeguide-table">
                            <?php foreach ( $size_tables as $table ): ?>
                                <?php foreach ( $table as $row ): ?>
                                    <tr>
                                        <?php foreach ( $row as $col ): ?>
                                            <td><?php echo esc_html( $col ); ?></td>
                                        <?php endforeach; ?>
                                    </tr>
                                <?php endforeach; ?>
                            <?php endforeach; ?>
                        </table>
                    </div>
                <?php endif; ?>
            </div>
            
            <div class="sizeguide-btn-wrapp">
                <a class="basel-popup-with-content basel-sizeguide-btn" href="#basel_sizeguide">
                    <?php echo basel_get_svg_content( 'size-quide-icon' ); ?>
                    <span><?php esc_html_e( 'Size Guide', 'basel' ); ?></span>
                </a>
            </div>
        <?php
    }

and replace this line

<?php echo basel_get_svg_content( 'size-quide-icon' ); ?>

with your SVG file content or with any other icon you want.

Thank you. It works great.
tWill the new icon (new name & .svg file) be overriten by theme-updates, because its in the “basel” folder?

Yes, if you place it in the parent theme folder.

[Author]

Posts