Simple Machines Community Forum

SMF Support => SMF 2.0.x Support => Topic started by: melanie1986 on August 10, 2018, 01:11:52 AM

Title: Mobile users
Post by: melanie1986 on August 10, 2018, 01:11:52 AM
 Hi,

I've been getting a lot of comments lately that people would love to join my site but since so many nowadays prefer to use their phones etc (I don't know why) they tell me that going on the site with their mobile devices and navigating it was a virtual nightmare. This I've noticed new members signing up, but never returning lately since Tapatalk now longer supports their app. Is there a good set for us, or an app members can use to properly view the forum and use it from their phones?
Title: Re: Mobile users
Post by: Biology Forums on August 10, 2018, 02:40:27 AM
How are you HTML and CSS skills? Perhaps it's time to download a responsive theme and begin modifying it how your forum currently looks. May take you a month of work, but it's definitely worth it.
Title: Re: Mobile users
Post by: shinglis on August 10, 2018, 02:58:05 AM
I use SMF4Mobile - https://smfmobile.com/ (https://smfmobile.com/) and users seem to like it. It is a paid mod.

For note, I will probably just use the responsive theme when 2.1 issued.
Title: Re: Mobile users
Post by: njtweb on August 10, 2018, 11:15:09 AM
Quote from: melanie1986 on August 10, 2018, 01:11:52 AM
Hi,

I've been getting a lot of comments lately that people would love to join my site but since so many nowadays prefer to use their phones etc (I don't know why) they tell me that going on the site with their mobile devices and navigating it was a virtual nightmare. This I've noticed new members signing up, but never returning lately since Tapatalk now longer supports their app. Is there a good set for us, or an app members can use to properly view the forum and use it from their phones?

What version SMF are you running, and what is your theme? Almost ALL of my traffic is on a phone. I don't like conventional mobile themes. I am running SMF 2.0.15 and am using the Default "Curve" theme with the "Responsive Curve" mod. It's great, works wonderfully, the only drawback is the default menu. So I made my own icon menu.
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 10, 2018, 12:42:55 PM
She's running 2.0.15, all custom themes.  Would have to change themes on all forums to make them responsive.  I'm currently having problems with Responsive Curve mod not working correctly with Curve Multi Color theme.  Installed it on another forum running default Curve and haven't had many complaints.  Won't work for OP.


Title: Re: Mobile users
Post by: melanie1986 on August 10, 2018, 03:52:53 PM
Quote from: Sir Osis of Liver on August 10, 2018, 12:42:55 PM
She's running 2.0.15, all custom themes.  Would have to change themes on all forums to make them responsive.  I'm currently having problems with Responsive Curve mod not working correctly with Curve Multi Color theme.  Installed it on another forum running default Curve and haven't had many complaints.  Won't work for OP.

Yes as he said, and sadly no I don't have any skills at all when it comes to HTML and CSS. I tried once and almost lost the entire site because of my stupidity. I'll check the responsive thing and see if that might work. Thanks for you answers everyone.
Title: Re: Mobile users
Post by: njtweb on August 10, 2018, 05:46:01 PM
Quote from: melanie1986 on August 10, 2018, 03:52:53 PM
Quote from: Sir Osis of Liver on August 10, 2018, 12:42:55 PM
She's running 2.0.15, all custom themes.  Would have to change themes on all forums to make them responsive.  I'm currently having problems with Responsive Curve mod not working correctly with Curve Multi Color theme.  Installed it on another forum running default Curve and haven't had many complaints.  Won't work for OP.

Yes as he said, and sadly no I don't have any skills at all when it comes to HTML and CSS. I tried once and almost lost the entire site because of my stupidity. I'll check the responsive thing and see if that might work. Thanks for you answers everyone.

Lots of excellent developers here who take job offers. I do it all time when I've got the cash and need something done or fixed correctly. Definitely worth it to ask for help.
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 10, 2018, 09:38:56 PM
Hey, Mim.  Responsive Curve mod will make a mess of your themes.  Best bet would probably be to look through available responsive themes, see if you can find one or two you can customize using graphics from your custom themes.   Or else just tell your members to use a computer, like they're supposed to.  IMO, an iDiotphone is totally unsuitable for viewing/using a forum, display is way too small, wrong aspect ratio, even best responsive themes have to sacrifice a lot of functionality.  People should grow up, and accept that a toy is just a toy.
Title: Re: Mobile users
Post by: Kindred on August 10, 2018, 10:05:49 PM
Please don't make such untrue statements.

Responsive curve works just fine on curve. That's the only theme it's supposed to work on.
Title: Re: Mobile users
Post by: Gwenwyfar on August 10, 2018, 10:09:05 PM
Quote from: Kindred on August 10, 2018, 10:05:49 PM
Please don't make such untrue statements.

Responsive curve works just fine on curve. That's the only theme it's supposed to work on.
And it can also work just fine in many curve-based themes, since some themes hardly edit the templates or do many base css changes, so it's not that exclusive to curve either. But that is a risk you'd have to take in testing it.
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 10, 2018, 10:14:12 PM
Quote from: Kindred on August 10, 2018, 10:05:49 PM
Please don't make such untrue statements.

She's not using Curve, she's using customized themes (one of which I did) that are not based on Curve, some of them are quite old.  I'm currently chasing a problem with Responsive Curve in Curve Multi Color, which is very close to default Curve (posted in mod topic).  Other comments are my opinion, as indicated in post. ;)


Title: Re: Mobile users
Post by: Gwenwyfar on August 10, 2018, 10:22:54 PM
Quote from: Sir Osis of Liver on August 10, 2018, 09:38:56 PM
Or else just tell your members to use a computer, like they're supposed to.  IMO, an iDiotphone is totally unsuitable for viewing/using a forum, display is way too small, wrong aspect ratio, even best responsive themes have to sacrifice a lot of functionality.  People should grow up, and accept that a toy is just a toy.

Nowadays many people don't have a computer. Specially if you're talking about common people that don't use computers for anything more than browsing the web and chatting. The other side is that many people use it while they are not home or don't have access to a computer. That's not all cases (there's always the lot of the phone fanatics) but it's a good portion of them. Really depends on what kind of public you have.
Title: Re: Mobile users
Post by: Mick. on August 10, 2018, 10:47:53 PM
Quote from: Sir Osis of Liver on August 10, 2018, 09:38:56 PM
Hey, Mim.  Responsive Curve mod will make a mess of your themes.  Best bet would probably be to look through available responsive themes, see if you can find one or two you can customize using graphics from your custom themes.   Or else just tell your members to use a computer, like they're supposed to.  IMO, an iDiotphone is totally unsuitable for viewing/using a forum, display is way too small, wrong aspect ratio, even best responsive themes have to sacrifice a lot of functionality.  People should grow up, and accept that a toy is just a toy.

Responsive Curve mod does not make a mess of custom themes. 90% of custom themes dont have templates since it robs it from the default theme, therefore it's already responsive in those areas. That's 99% of the battle covered. All you need in your custom theme is to add a responsive menu, make it scalable and adjust the width to max-width and some minor css adjustments. Make sure to add the responsive.css from default theme to the custom theme's css and call it from the index.template. It's very easy now since the team did most of the work.  ...and my site is fully responsive in any resolution. I use of course SMF 2.0.15 and SimplePortal. Simple Portal i made it responsive 100%.  https://www.idesignsmf.com
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 10, 2018, 11:30:33 PM
Ok, here's what she's currently running:

   Forum 1 -   SP 2.3.6
                    Custom theme 1
                        index.template.php

   Forum 2 -   SP 2.3.6
                    Custom theme 2   
                        index.template.php

   Forum 3 -   SP 2.3.6
                    Custom theme 3
                       BoardIndex.template.php
                       GenericList.template.php
                       index.template.php
                       MessageIndex.template.php
                       ModerationCenter.template.php
                       Profile.template.php

   Forum 4 -   SP 2.3.6
                    Custom theme 4
                       BoardIndex.template.php
                       Display.template.php
                       GenericMenu.template.php
                       index.template.php
                       Memberlist.template.php
                       MessageIndex.template.php
                       PersonalMessage.template.php
                       Recent.template.php
                       Settings.template.php
                       Stats.template.php

All have quite a few mods.  First two themes look doable, third and fourth themes not so much.

Title: Re: Mobile users
Post by: Sir Osis of Liver on August 11, 2018, 12:14:55 AM
Quote from: Mick. on August 10, 2018, 10:47:53 PM
Make sure to add the responsive.css from default theme to the custom theme's css

Yessssssssssss! That's what I needed to know to fix the other forum I'm working on.  Thanks Mick. (https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fwww.thekrashsite.com%2Fpics%2Flove.gif&hash=8b5df8e99735e727a37e7f6d21b459e841365be0)
Title: Re: Mobile users
Post by: Mick. on August 11, 2018, 12:25:57 AM
Quote from: Sir Osis of Liver on August 10, 2018, 11:30:33 PM
Ok, here's what she's currently running:

   Forum 1 -   SP 2.3.6
                    Custom theme 1
                        index.template.php

   Forum 2 -   SP 2.3.6
                    Custom theme 2   
                        index.template.php

   Forum 3 -   SP 2.3.6
                    Custom theme 3
                       BoardIndex.template.php
                       GenericList.template.php
                       index.template.php
                       MessageIndex.template.php
                       ModerationCenter.template.php
                       Profile.template.php

   Forum 4 -   SP 2.3.6
                    Custom theme 4
                       BoardIndex.template.php
                       Display.template.php
                       GenericMenu.template.php
                       index.template.php
                       Memberlist.template.php
                       MessageIndex.template.php
                       PersonalMessage.template.php
                       Recent.template.php
                       Settings.template.php
                       Stats.template.php

All have quite a few mods.  First two themes look doable, third and fourth themes not so much.



Thats not a problem. The responsive css file is not going to edit those templates directly and break her forum on desktop view. It may/may not in mobile tho but you can adjust it in the theme's css if whatever mod altered it previously. Just gotta chase the classes and change the properties. Her best solution is to find a responsive theme and use it, unless she loves the themes she's already using and have someone work it for her.
Title: Re: Mobile users
Post by: Mick. on August 11, 2018, 12:29:52 AM
Quote from: Sir Osis of Liver on August 11, 2018, 12:14:55 AM
Quote from: Mick. on August 10, 2018, 10:47:53 PM
Make sure to add the responsive.css from default theme to the custom theme's css

Yessssssssssss! That's what I needed to know to fix the other forum I'm working on.  Thanks Mick. (https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fwww.thekrashsite.com%2Fpics%2Flove.gif&hash=8b5df8e99735e727a37e7f6d21b459e841365be0)


...and call it from the index.template   
   <link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive.css?fin20" />

..and im sure you already have the meta to make it scalable
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 11, 2018, 12:36:29 AM
A lot of work went into her themes, I'm sure she'd like to keep them.  I can install them on a test forum and add the mod and check pc view, but I don't use a phone so I can't see the result in mobile. 

I'm surprised responsive curve doesn't add the css to other themes, it did edit the index template correctly.
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 11, 2018, 12:43:59 AM
Still not working on iphone.  I have this in index.template.php -



<meta name="viewport" content="width=device-width, initial-scale=1" />';

<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive', $context['theme_variant'], '.css?fin20" />';


Title: Re: Mobile users
Post by: Antes on August 11, 2018, 03:46:59 AM
Quote from: Sir Osis of Liver on August 11, 2018, 12:43:59 AM
Still not working on iphone.  I have this in index.template.php -



<meta name="viewport" content="width=device-width, initial-scale=1" />';

<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive', $context['theme_variant'], '.css?fin20" />';




Your theme might have different min-width value in it.
Title: Re: Mobile users
Post by: Mick. on August 11, 2018, 08:37:16 AM
Quote from: Sir Osis of Liver on August 11, 2018, 12:43:59 AM
Still not working on iphone.  I have this in index.template.php -



<meta name="viewport" content="width=device-width, initial-scale=1" />';

<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive', $context['theme_variant'], '.css?fin20" />';




Nah, don't use this one <link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive', $context['theme_variant'], '.css?fin20" /> That's for the default theme only

Instead use, <link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/responsive.css?fin20" />
and put it inside the <head>  and the viewport meta well, add it with the other meta tags in index.template, Make sure the responsive.css is in the the css folder of such custom theme.  Also checkout this tool for responsive websites http://ami.responsivedesign.is/# tho i dont think it works with https sites. Or if you use chrome like i do, install the resolution test extension to your browser.


Another thing...  i viewed the css file of that Stargate site. The wrapper is..
#wrapper {
width: 1050px;
font-size: 100%;
margin: 0 auto;
}


Change it to..
#wrapper {
        width: 100%;
max-width: 1050px;
font-size: 100%;
margin: 0 auto;
}

so it adapts to responsiveness. (not on her site but on your test site). My old themes use a width of 990px; very small before responsive was available. Now i use 1100px; and higher..... and my main site i have it at 1400px;
Title: Re: Mobile users
Post by: Sir Osis of Liver on August 11, 2018, 05:51:56 PM
Found the problem with Curve Multi Color.  Responsive css must be in the color variant .css file (index_green.css), doesn't work just having responsive.css in theme /css.
Title: Re: Mobile users
Post by: melanie1986 on August 15, 2018, 08:38:22 PM
 thank you again to everyone for your thoughtful answers. Firstly, I guess you could say that effectively only two of my themes are used to any great extent, being the forum default dark theme and the light theme of the same. I was wondering, as we have a theme changer, is it possible to set up one just for Mobile users?

The reason this has become more of an issue now for me and I suppose many other forum owners is as Gwenwyfar said more and more people are using mobile devices online. This also includes things like Ipad and similar. I'm on another site as a member, specifically Stargate Command, and though I have attracted a lot of interest from that site, the answer for not joining is always the same, mine isn't mobile adaptive.  :-\ and I wouldn't have a clue as to how to change things either.
Title: Re: Mobile users
Post by: drewactual on August 15, 2018, 08:45:54 PM
out of curiosity, why don't you guys use @media css declarations?  doing so allowed me to minify a massive css file and http2 allows me to push it (even to mobile), while cache and mod_expires allows it to stick for a specified time (not advisable until you're happy with it)...

this allows ONE css... I know it isn't perfect, but.... it works just fine and my users are happy with it... it allows offering not only a mobile phone resolution but also a tablet and even a phablet... best of all you don't have to mess with hard coding at all or scripts to sense browser/device and adjust accordingly. 

you can see it on the site listed in my signature, and again i know it isn't perfect, but.... it works well enough that my users on that site are very happy with it.
Title: Re: Mobile users
Post by: Kindred on August 15, 2018, 09:05:01 PM
You're late to the game drew.  We've already been suggesting she use a responsive theme
Title: Re: Mobile users
Post by: drewactual on August 15, 2018, 09:07:15 PM
Quote from: Kindred on August 15, 2018, 09:05:01 PM
You're late to the game drew.  We've already been suggesting she use a responsive theme

hehehehehheeeehehehehee!!! i guess that's what i get for reading the last page only, huh?  heheheheheheeee!!
Title: Re: Mobile users
Post by: Gwenwyfar on August 15, 2018, 10:16:21 PM
Quote from: melanie1986 on August 15, 2018, 08:38:22 PM
thank you again to everyone for your thoughtful answers. Firstly, I guess you could say that effectively only two of my themes are used to any great extent, being the forum default dark theme and the light theme of the same. I was wondering, as we have a theme changer, is it possible to set up one just for Mobile users?

The reason this has become more of an issue now for me and I suppose many other forum owners is as Gwenwyfar said more and more people are using mobile devices online. This also includes things like Ipad and similar. I'm on another site as a member, specifically Stargate Command, and though I have attracted a lot of interest from that site, the answer for not joining is always the same, mine isn't mobile adaptive.  :-\ and I wouldn't have a clue as to how to change things either.
Yes, it is possible. What the options are would depend on your themes but either you could trigger another theme through js when a mobile user is detected, or, in case your theme's templates isn't so heavily modified, you could toggle a different css for both (not just the mobile css, but an entire theme altogether).

Going by what was said of your theme though, maybe triggering a different theme with js is going to be more doable. It shouldn't be difficult to do it.
Title: Re: Mobile users
Post by: Mick. on August 15, 2018, 11:08:26 PM
@melanie  Is this the site in Question? http://lostworldssff.com/index.php It doesnt look heavily modified.  If so, why keep beating around the bush over a theme that is not responsive? Download a responsive theme and have your guy add the fancy logos and change the hex colors accordingly. It would be much easier to do. The only thing i see you might have difficulty is those banners in your board categories but since those are images, they'd be adjusted to device size.
Title: Re: Mobile users
Post by: njtweb on August 16, 2018, 07:04:03 AM
Quote from: Kindred on August 10, 2018, 10:05:49 PM
Please don't make such untrue statements.

Responsive curve works just fine on curve. That's the only theme it's supposed to work on.

Yep, works great on mine. Just change colors and stuff to curve. That's what I did to make it more in line with the interest of the site.
Title: Re: Mobile users
Post by: melanie1986 on August 21, 2018, 07:20:18 PM
Quote from: Mick. on August 15, 2018, 11:08:26 PM
@melanie  Is this the site in Question? http://lostworldssff.com/index.php It doesnt look heavily modified.  If so, why keep beating around the bush over a theme that is not responsive? Download a responsive theme and have your guy add the fancy logos and change the hex colors accordingly. It would be much easier to do. The only thing i see you might have difficulty is those banners in your board categories but since those are images, they'd be adjusted to device size.

Thanks Mick,  :)

That is the one. We do have alternate themes and we have posted a question for members to respond to; basically what current theme they prefer. From that information we can do something that hopefully pleases everyone. Doing the graphics isn't that hard, I have done most of that myself at least.
Title: Re: Mobile users
Post by: Mick. on August 21, 2018, 07:42:13 PM
Quote from: melanie1986 on August 21, 2018, 07:20:18 PM
Quote from: Mick. on August 15, 2018, 11:08:26 PM
@melanie  Is this the site in Question? http://lostworldssff.com/index.php It doesnt look heavily modified.  If so, why keep beating around the bush over a theme that is not responsive? Download a responsive theme and have your guy add the fancy logos and change the hex colors accordingly. It would be much easier to do. The only thing i see you might have difficulty is those banners in your board categories but since those are images, they'd be adjusted to device size.

Thanks Mick,  :)

That is the one. We do have alternate themes and we have posted a question for members to respond to; basically what current theme they prefer. From that information we can do something that hopefully pleases everyone. Doing the graphics isn't that hard, I have done most of that myself at least.

It looks pretty good if you ask me. But i wouldn't involve users on what theme they prefer. Can't please everyone.
Title: Re: Mobile users
Post by: melanie1986 on October 15, 2018, 07:00:57 PM
Quote from: Mick. on August 21, 2018, 07:42:13 PM
It looks pretty good if you ask me. But i wouldn't involve users on what theme they prefer. Can't please everyone.

Sorry for the long delay in answering Mick, I've hit a wall a couple of times with wonko health issues. Hopefully getting back to 100% soon.

Presently I have had to put this project on the back burner as being a little difficult for me. With the help of Sir Osis we've created a test site and installed the mobil desktop theme; I'm having trouble though getting everything to fit properly.
Title: Re: Mobile users
Post by: Sir Osis of Liver on October 15, 2018, 09:22:46 PM
Only thing that looks out of place is your header image.  Try using width: 100%; height: auto;. 
Portal blocks are stacked vertically, that's how it's supposed to work.
Title: Re: Mobile users
Post by: palmdoc on October 21, 2018, 03:31:38 AM
After experimenting with several free responsive themes, I settled on  the Sunrise theme which works great with mobiles and has an option to switch from light to dark mode.
Tapatalk does work with 2.015 and I have installed it as well