Theme Responsiveness

[mswalehe]

Hello Satori Design,
Thanks for the great theme. I am a verified purchaser. I had a quick question regarding the responsiveness of this theme. When I try to open the website on my iPhone or mobile device, tt seems to revert into a mobile theme, and the layout gets all wonky. Was there anyway to default the theme from not reverting to the mobile theme when on a mobile device.

The site is http://www.agfences.com, that I am currently building. All mobile devices Ive tried seem to have reverted to the ‘mobile’ design.

Thank you.
Cheers.
– Mike

[mswalehe]

Also,
There seems to be a malfunction with the twitter widget, when display posts. Sometimes it works but the majority of the time it dosent display properly and just shows “42 years ago” “1 year ago” I might be missing something but is there a way to fix this

Cheers.

[satori]

Hey Mike,

first of all, thank you for the purchase!

In case you want to disable the responsive layout (i.e. the adaptation of the theme to smaller screens), please download this custom file I’ve made for you, unzip it, and upload into the theme folder (/wp-content/themes/Kabuki/), replacing the existing file. I would be very grateful if you could describe (or better still – provide a screenshot) in which way your website becomes messed up while viewing from the mobile device – this would help me to improve the theme for future version updates. Please also note that the menus should turn into drop-downs on mobile devices – this is a widely accepted part of responsiveness concept, and improves usability of the theme :)

Regarding the Twitter widget – this is a very peculiar bug! Could you please try changing the twitter username in the widget settings to any other username (e.g. “envato” or “satoristudionet”) – do the tweets display as intended then?

One piece of advice – I would recommend optimizing your background slider images, since currently they are quite large and take some time to load, which may annoy visitors. Your slider images are currently 3264×2448 pixels and 2.30 Mb, which is a lot by web standards. I’d recommend scaling them down to 2560×1600 pixels, which is enough to cover 99.9% of the possible screen sizes; this will both reduce the size and increase the loading speed for the website.

Sincerely,
Andrew | Satori

[mswalehe]

Hello Andrew,

Thank you for the prompt detailed response. I am very pleased with the theme purchase so far and just want to say thanks again for putting the time and effort into making this theme and also with your helpful responses. :)

Also, Thank you for the custom file. I will be trying it out once i get home from work, to see what it looks like. I don’t have a ftp client on the computers here at work.

I am aware that the menus should turn into drop down menus, and I dont mind having one, but I had 2 questions regarding the drop down menus.

http://imageshack.us/a/img90/6269/wonky.jpg

(The screenshot of my iPhone describing the ‘wonkiness’)

As you can see the picture slider controls overlap the drop down menu and makes it in inaccessible and rather quite ‘wonky’ unless I resize it. Also the drop down menu turns into a grey color. Is there anyway to change this drop down menu color? Possibly to Black and Red like the original menus.

Regarding the twitter widget bug. I have tried numerous different twitter accounts and it seems that all of them have the same problem. They all turn into ’42 years ago’ ‘1 year ago’ with no tweets. Its very odd, and also frustrating cause the problem is very intermittent, sometimes it works and 75 percent of the other time it never works. Its very hit or miss, mostly miss. If you could find a fix for that, it would be greatly appreciated.

Also thanks for the advice, I will be re-sizing the pictures for optimal load times, once I get home.

Looking forward to your response.

Cheers.

– Mike

[mswalehe]

P.S.

Here is a screenshot of the twitter widget bug,

http://imageshack.us/a/img838/3231/twittererrorx.jpg

Thanks.

– Mike

[mswalehe]

Hello Andrew,

I just installed the new lessframwork.css in the kabuki theme folder. It seems to have not resloved the problem but actually made it worse. The main menu is now totally missing when visting the site from a mobile phone. I backed up the previous framework.css so everything should be ok. I noticed when going to the kabuki heme preview on themeforest: https://satoristudio.net/themedemo/?theme=kabuki on a mobile it seems to work fine in regards to the resposivness not reverting to a mobile theme.

Cheers.

– Mike

[mswalehe]

Heres a screenshot of the twitter bug acting up again:

http://img40.imageshack.us/img40/5452/twitterbug.png

:s

[satori]

Hey Mike,

After your comment I re-visited the mobile version of the slider navigation/caption block and arrived at (I think) a more consistent and usable mobile version of the theme (please see the demo). In case you want to implement this, please download the new lessframework.css, unzip it, and upload into the theme folder (/wp-content/themes/Kabuki/).

Regarding your question on the drop-down menus – I need to investigate this issue deeper, since I own an Android device and it renders the menus as they are supposed to be – i.e. black (see e.g. this screenshot from my smartphone). Could you please tell me which iPhone model you are using?

I must admit that the Twitter widget has been a pain for awhile – ever since Twitter changed its API and the old way of grabbing data stopped working. Nevertheless, some time ago I seem to have fixed the widget, and it is working quite well on all of my preview websites, e.g. on Kabuki blog page. To find the possible reason for the misbehavior of the plugin on your website, please tell me if you are using any third-party plugins with theme. In the meantime, you can use e.g. the Twitter widget provided by WordPress’ Jetpack plugin.

Sincerely,
Andrew | Satori

[mswalehe]

Hello Andrew,

These are all the plugins I currently have installed:

http://img850.imageshack.us/img850/2180/pluginsf.png

Regarding the iPhone I am currently using a iPhone 4S with iOS 6.

Regarding the framework I tried replacing it again. It seems that the whole logo and menu disappears only in the iPhone Safari Browser.

I tried opening it in google chrome browser on the iPhone, the menu is still there, but it still covers the menu. When visting the demo site on the iPhone this is what i get.

https://satoristudio.net/kabuki/ iPhone 4S iOS6 Google Chrome – http://imageshack.us/a/img543/3246/ga1gk.jpg
https://satoristudio.net/kabuki/ iPhone 4S iOS6 Safari – http://imageshack.us/a/img541/2899/ga2k.jpg

http://www.agfences.com – iPhone 4S iOS6 google chrome with new custom less.framework.css – http://img69.imageshack.us/img69/3522/ga3w.jpg

The screenshot from your Android, the slideshow control panel as I can see is at the very top of the page. That looks and functions amazingly better than what currently is displaying on my iPhone for agfences.com. Maybe its a iPhone only problem. Hopefully we can find a fix for this, and the twitter bug.

Thanks again for your help and Cheers to more iPhone debugging. :)

Looking forward to your response.

– Mike

[satori]

Hey Mike!

I’ve tested this combination of plugins with Kabuki, but the Twitter widget still functions as it should (on your website the plugin also seems to work well..). To troubleshoot, could you please try the following:
1). Remove the text widget with the Twitter code found under the Twitter widget and see if the issue is fixed.
2). Use Jetpack’s Twitter plugin instead.
3). Try disabling Jetpack (most of its functions are already covered by the theme anyway), and if this does not help, other plugins one by one, to find the culprit.

Regarding the new version of the responsive mobile layout – your website’s current code suggests that you haven’t updated the lessframework.css file. Could you please try again, with this file?

Finally, I will ask my friends for an iPhone to figure out what’s wrong with the rendering there. However, I suspect that the issue might again be in Jetpack – if you could try the iPhone version with this plugin deactivated and the new lessframework.css installed, it would help me a great deal.

Thanks!

Sincerely,
Andrew | Satori

[Author]

Posts