Return to previous page

Topic: WPML LANGUAGE SWITCHER IN MOBILE FIXED HEADER

BWA2

Participant

January 27, 2018 8:48 am

Hello,
This post is in reference to the already closed post:
https://www.8theme.com/topic/wpml-language-switcher-in-mobile-fixed-header/

What you described works well but is it possible to make this work with a child theme so that the changes don’t get lost every time I update the main theme?

I tried saving js/etheme.js and js/etheme.min.js in the child theme but it had no effect.
I have to save the files in the main theme for the changes to be applied.

Any ideas how to make it work with a child theme?

Thank you so much!

Site URL: hidden

#183125 copied to clipboard

Rose Tyler

Support staff

January 29, 2018 11:05 am

Hello,

Please read how to include js via child theme in this topic https://www.8theme.com/topic/possible-to-add-secondary-menu-to-fixed-menu/#post-181824

Regards

#183200 copied to clipboard

BWA2

Participant

February 20, 2018 9:25 am

Hi Rose,
I have done
1. added wp_enqueue_script(‘child-theme’, get_stylesheet_directory_uri().’/etheme-child.js’,array(‘etheme’),false,true); to our child theme function.php

Then I created etheme-child.js and added the following code to it:

fixedHeader: function() {

            // **********************************************************************//
            // ! Fixed header
            // **********************************************************************//

            if ( $( 'body' ).hasClass( 'et-fixed-disable' ) ) return;
            if ( $( 'body' ).hasClass( 'et-vertical-fixed' ) && $(window).width() > 992 ) return;

            var header = $('.header-wrapper'),
                logo = header.find('.header-logo').html(),
                menu = header.find('.menu-wrapper').first(),
                menuClass = menu.attr('class'),
                menuRight = header.find('.menu-wrapper-right'),
                navbar = header.find('.navbar-header').html(),
                menuBtn = header.find('.navbar-toggle').html(),
                color = $('.page-wrapper').data('fixed-color'),
                startOffset = 240,
                menuHtml;
				var menu_switcher = header.find('.mobile-language-switcher').html();

            // Do it for non standard navbar
            if ( $( 'body' ).hasClass( 'shop-top-bar' ) ){
                navbar = this.NavbarHeader( 'fixed' );
            }

            if( menuRight.length > 0 ) {
                menuHtml = menu.html() + menuRight.html();
            } else {
                menuHtml = menu.html();
            }

            // Check values for "Toolset Layouts" plugin
            if ( logo == null ) logo = '';
            if ( menuHtml == null ) menuHtml = '';
            if ( navbar == null ) navbar = '';
            if ( menuBtn == null ) menuBtn = '<span class="sr-only">Menu</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>';

            var fixedHeaderHtml = '<div class="fixed-header header-color-' + color + '"><div class="container"><div class="header-logo">' + logo + '</div><div class="' + menuClass + '">' + menuHtml + '</div><div class="mobile-language-switcher">'+menu_switcher+'</div><div class="navbar-header">' + navbar + '</div><div class="navbar-toggle">' + menuBtn + '</div></div></div>';

            header.before(fixedHeaderHtml);

            if ($(window).width() < 768 ) { startOffset = 120; }

            var fixed = $('.fixed-header');
            if ( $('body').hasClass('et-header-fixed') ) {
                $(window).scroll(function(){
                    var currentScroll = $(this).scrollTop();

                    if( currentScroll > startOffset ) {
                        showFixed();
                    } else {
                        hideFixed();
                    }

                });
            }
            else {
                if ( $('body').hasClass('et-header-sticky') ) {
                    var previousScroll = 0,
                    animatedTimer = 0,
                    stickyHeight = fixed.outerHeight(),
                    stickyAfter = fixed.outerHeight() + 20;
                        $(window).scroll(function() {
                            var currentScroll = $(this).scrollTop();

                            // sticky header
                            if( ( currentScroll < previousScroll ) && ( currentScroll > startOffset ) ) {
                                fixed.addClass('sticky-header-enabled');
                            } else {
                                fixed.removeClass('sticky-header-enabled');
                            }

                        /*if (currentScroll < previousScroll){
                            // Scroll up
                        } else {
                            //Scroll down
                        }*/

                        previousScroll = currentScroll;
                    });
                }
            }

            var showFixed = function() {
                fixed.addClass('fixed-enabled');
            };

            var hideFixed = function() {
                fixed.removeClass('fixed-enabled');
            };
        },

and then I uploaded the etheme-child.js to the same folder as the child theme’s functions.php file.

But the WMPL flags still don’t show in the fixed mobile menu unfortunately. They only show in the initial main menu.

#185604 copied to clipboard

Olga Barlow

Support staff

February 20, 2018 11:52 am

Hello,

Can you provide me admin panel and FTP access to your site to check this?

Regards

#185641 copied to clipboard

BWA2

Participant

February 20, 2018 1:30 pm

Hi Olga,
Thanks for your reply.
Here are the logins.
Thank you for looking into this.

#185666 copied to clipboard

Rose Tyler

Support staff

February 22, 2018 8:27 am

Hello,

We replaced all your code from theme-child.js (it was not able to work) and added working code

jQuery(document).ready(function($){
	var menu_switcher = $('.header-wrapper').find('.mobile-language-switcher').html();
	var fixed_menu = $('.fixed-header').find('.menu-wrapper');
	$(fixed_menu).after('<div class="mobile-language-switcher">'+menu_switcher+'</div>');
})

Now you should not worry about changing etheme.js and compressing into etheme.min.js in our theme. Menu switcher will be added without any worries just from your child-theme.

Regards

#185923 copied to clipboard

BWA2

Participant

February 22, 2018 8:31 am

Hi Rose – Thank you so much!
You guys have the best support of all theme makers I have ever worked with!
Thanks a lot.

#185926 copied to clipboard

Olga Barlow

Support staff

February 22, 2018 10:05 am

You are welcome!

Would you mind to rate our product:
http://prnt.sc/d256m6
https://themeforest.net/downloads

That would be much appreciated 🙂

Regards

#185946 copied to clipboard

BWA2

Participant

February 22, 2018 10:29 am

Hi Olga,
I already rated it 5 Star. Would rate it 6 star if I could 🙂

#185956 copied to clipboard

Olga Barlow

Support staff

February 22, 2018 1:34 pm

Oh, thank you very much!

Regards

#185987 copied to clipboard

Viewing 10 results

1 through 10 (of 10 total)

You must be logged in to reply to this topic.Log in/Sign up

Lorem ipsum dolor sit amet consectetur adipisicing elitsed do

Choose file (max-size 1mb, zip or rar)

$0.00

Oops, looks like you don’t have access!

You may extend support period on ThemeForest and then update its status by clicking "Update" button in your Account area.

Purchase code	Expiration date
adb2cf8c-15ed-4d7a-a406-790658a81a6c	03 Dec 2019

Topic: WPML LANGUAGE SWITCHER IN MOBILE FIXED HEADER

Usefull links

Did you know ?

Support Stats

Topic: WPML LANGUAGE SWITCHER IN MOBILE FIXED HEADER

Usefull links

Did you know ?

Support Stats

Log in to 8theme

Oops, looks like you don’t have access!