RTL issues

[goldeneaglesteam]

hi,

thank you for your support ..
your theme now supports RTL and you made awesome efforts to do that.

I still have a simple issue.
I now start to build my website so I noticed this issue.

I use WPML to translate the website (en, Arabic ).
there is white space in the top between topbar and slider
still have a problem with chrome.

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

Hi

I checked your website on Chrome, it looks fine, no white space is founded. This is my screenshot https://www.dropbox.com/s/a6j72xajiqxp9up/Screenshot%202018-05-02%2001.05.50.png?dl=0

Tested with Chrome + Mac OSX

Could you post your screenshot link here?

Thanks

[goldeneaglesteam]

This reply has been marked as private.

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

1. What version of your chrome and firefox? It’s working fine on the latest version of the browsers.
Chrome: https://www.dropbox.com/s/zerj775c6a9g8fn/Screenshot%202018-05-06%2013.43.50.png?dl=0
Firefox: https://www.dropbox.com/s/axk7eqvu9qczzb6/Screenshot%202018-05-06%2013.44.49.png?dl=0

2. I can’t reproduct this issue, because the menu looks no problem when scrolling down the page on my computer, but I found a JS Error in Chrome console: https://www.dropbox.com/s/fn601vohz6tiwxk/Screenshot%202018-05-06%2013.47.58.png?dl=0 Not sure whether it’s caused by this error or not, but the script.js file is not the theme file. Also, please try to turn off the minify CSS/JS via Appearance > Themes options > General setting, and check again.

By the way, how about my RTL demo display on your computer? https://dgwork.co/rtl Are the same issues also appeared? If no, try to deactivated the 3rd-party plugins on your site and check again.

3. What’s problem on translation? The text in the metabox should be translated with WPML string addon.

Thanks

[goldeneaglesteam]

This reply has been marked as private.

[goldeneaglesteam]

hi,

1- I disabled all plugins
2- I deleted all pages
3- re-enabled main plugins (theme plugin)
4- re-import the data

issue 1, issue 2 was fixed

[FocuxTheme Support]

Hi

1. Please check again, I have added #page{margin-top:0;} to get rid of the space.

2. If it was working fine after you deactivated AnsPress plugin, you’d better to ask the plugin developer.

3. You should select custom template here https://www.dropbox.com/s/7z7cwvknuktsgc5/Screenshot%202018-05-10%2015.46.33.png?dl=0

Thanks

[goldeneaglesteam]

This reply has been marked as private.

[goldeneaglesteam]

This reply has been marked as private.

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

2. I was noticed that you mentioned when you translate the homepage, the second issue came back. I tried to change the text with page builder for Arabic page, then scrolled down the page, and scrolled up again, the top bar looks fine, sorry I still can’t reproduce this issue on my computer, more details would be helpful! This video will show you my steps: https://youtu.be/P32uXw_tHmg

4. What’s the version of IE? Just want to confirm it’s Internet Explore or Microsoft Edge browser?

5. Currently, you can change the font via Appearance > Theme Options > Typography.

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

Sorry that I still can’t reproduce the issue 4. I tested on 3 different android phone with different browsers, it works fine, but I don’t have Samsung Note 3, I can only test it with this simulator http://troy.labs.daum.net/ but it still works fine.

is “Mobile internet” native browser on Samsung Note 3?

[goldeneaglesteam]

yes “Mobile internet” is native browser on Samsung Note 3

[FocuxTheme Support]

According to this screenshot https://drive.google.com/file/d/0BzlgDJ651_EILVFKZURRZGhfTzdYSy1nWlZlekJVbWxOQWpN/view
The counter section was broken on mobile internet, but I see you have changed the home layout, and removed counter section, so how about it on mobile internet browser now?

[goldeneaglesteam]

the problem with all sections not the counter only..

i tried many things , i have waste more of time …

[FocuxTheme Support]

I gave a test by the following custom CSS, but I don’t have a Samsung phone, so hope you can help me to test the page on your mobile phone again.

@media(max-width:960px){
	.vc_row[data-vc-stretch-content]{
		min-width:none;
		width:100%;
	}
}

[FocuxTheme Support]

I found Samsung Internet Browser APP on Google Play, I will install it on my android phone soon and test it again, hope I will fix all issues tonight.

[goldeneaglesteam]

hi,,
Wait for a solution ..

The design has many problems with many mobile devices, i tried many browser from many mobile,
Many customers complained about this too ..

As Google:

Page is not mobile friendly
This page can be difficult to use on a mobile device
Fix the following 2 issues

1- Clickable elements too close together
2- Content wider than screen

[FocuxTheme Support]

Sorry.

I have installed Samsung browser and tested the page, not sure the reason, still can’t reproduce the previous issues.
So I have tried to rebuild a new homepage to fix some responsive issues. Because I found there are too many nested rows in your homepage.
The new homepage is here: https://www.vatoce.com/ar/new-home/ You can compare it with your old homepage, know where I’ve changed. Also, please check it on your Samsung phone again.

By the way, I suggest you can deactivate W3 Total Cache plugin while debugging the layout issue, also I found W3 Total has too many options so that it may cause the CSS issues by incorrect option configuration. I suggest you use the Autoptimize plugin, it’s easy to use and fast.

For those two issues

1- Clickable elements too close together

Have it pointed out which elements? If the elements in the page builder, you can try to add margin or padding space in design options tab when you edit an element.

2- Content wider than screen.
I rebuilt the home page, maybe this issue will be fixed, but I’m not sure, please check it on your Samsung smartphone. I just checked it on iPhone 6s, the content width is normal.

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

I downloaded Samsung Mobile Internet browser to my android phone(it’s not Samsung phone), then I tested the home page and new homepage, the content width is a little wider but not like on your phone, this is the video: https://www.dropbox.com/s/jev7qb8x6fggnfq/Untitled.mov?dl=0

After that, I tested the page on this Simulator, the same result. http://troy.labs.daum.net/

Then, I updated ThemeVan Shortcodes plugin, use max-width:100% to force the section width smaller than the screen, but I don’t have a Samsung Mobile phone, could you test again and focus on the content width issue? Remember clear the browser cache.

[goldeneaglesteam]

hi,
thanks for your reply,,
amazing!!!

i tried using max-width:100% and i cleared the browser cache ..
i stopped my browser and rerun it now it work as your video , the content width is a little wider

how can i fix that ..

[FocuxTheme Support]

Glad to hear this!

I can’t log in your WP backend anymore. You can try to add the following custom CSS to Customize > Additional CSS

.page_transparent_nav #page{max-width:100%;}

Then refresh the page after you clear the browser cache.

Thanks

[goldeneaglesteam]

hi,

i replaced this code (your custom code ):

@media(max-width:960px){
  .vc_row[data-vc-stretch-content]{
    min-width:none;
    width:100%;
  }
}

with this code :

@media(max-width:960px){
  .vc_row{
    width:100%;
    max-width:100%;
  }
}

because there is red error line in min-width:none;

and it work fine now
but i’m afraid if this update will affect others rows (rows with another type ).

[goldeneaglesteam]

google test issue “1- Clickable elements too close together” , i think it because of the top menu ..

[FocuxTheme Support]

Your code is correct.

It’s only effective for the tablet and big screen mobile phone.

For top button space issue, please try the following custom CSS, I will also include it in the new version.

@media (max-width: 768px){
  #site-icons {
    width: 125px;
  }

  #site-icons a{
    margin-left:16px;
  }

  .main-navigation{
     margin-left: 10px;
  }
}

[goldeneaglesteam]

This reply has been marked as private.

[FocuxTheme Support]

Hi

Look at the CSS I posted in the previous topic.

#site-icons {
    width: 125px;
  }

Please try to decrease the width value one pixel by one pixel. For example, 120px;

We have added the “Clickable elements too close together” issue to our update list and will check the global site.

For the slider error issue, it looks like some scripts and css files are loaded failed. Have you used CDN? How about turn off it?

Sometimes, the static page caches may cause this kind of issue when enabled CDN.

[Author]

Posts