Forum Style - Lightweight Style for Small Screen Devices (cell phone, iphone, mobile, android)

A lightweight *forum only style aimed at small screen devices such as Windows Smartphones, Nokias and even iPhones. It has VERY low bandwidth requirements - 15 times less on my site - 20K as opposed to 300K for forumhome.

*forum only - I have done a very small amount of rough work on CMS templates, a simple single column CMS *could* be created to work with this style without too much effort. However I am not sure if you can have a different CMS layout dependent on which style you are using?

This is an update to the mobile style I have previously released.

The changes are predominantly aesthetic to take advantage of larger screens.

It is also much easier to change colour schemes by editing the commented CSS file.

Demo: http://vbdev.org/forum.php?styleid=7

This is a a lightweight style and as such has much reduced functionality/information over the default vBulletin style.

Install instructions:

• Firstly, if upgrading, I recommend installing this as a new style rather than overwriting your previous install. This way you get to test it first without trashing your existing style.
• BACKUP YOUR EXISTING lightweight.css.php FILE IF YOU HAVE CSS CUSTOMISATIONS
• Download ZIP file
• Unzip to a local/temp directory
• Edit lightweight.css.php file to customise colours if required
• Upload contents of the upload directory in the zip file folder to your forum root.
• Install style XML via Style Manager in your ADMINCP
• **Install and configure "LightWeight Style Options"
• See post 2 for a FAQ
• Click "Mark as Installed"
• Test it out
• Leave a rating
• Leave feedback
• Enjoy checking your site from your mobile phone without the need to pinch/zoom/wait etc...

Version Control:

1.0.0 - 25 AUG 2010 - Initial Release on vBulletin.org
1.0.1 - 26 AUG 2010 - Fixed "Mark All Forums Read" link in Search results. Released Lightweight Style Options to customise this
1.0.2 - 21 MAR 2011 - Updated to 4.1.2, removed short tags from CSS, fixed some issues discovered since last release, added some stuff.
1.0.3 - 16 DEC 2011 - Updated to 1.0.3, tried to fix all known issues. Nothing new. If you have updated your site as bugs have been found, probably no need to upgrade. But if you're upgrading your site from to 4.1.9, might be worthwhile.
1.0.3a - 16 DEC 2011 - remove test ad hook code accidently left in postbit_legacy template

Branding Free:

The style is free to use. However I ask that you keep links in the footer. If you want to remove them - send me a donation of an amount you can afford, or that you think is fair/reasonable, it's up to you how much.

[rughis]

Originally Posted by dartho

Are you using the latest version of the style? I did an update a couple weeks back that fixed that issue in 4.1.2. Just import the XML, no need to update the CSS

Hi dartho, thank you.

Now everything is working fine, thank you for your suggestion and your work. Your mobile style is really the best for vbulletin sites.

[dartho]

@NgocTam
Try pasting this into the bottom of your header template in this style:

<script type="text/javascript">
function fixImgs(maxW) {
  var pix=document.getElementsByTagName('img');
  for (i=0; i<pix.length; i++) {
    w=pix[i].width;
    h=pix[i].height;
    if (w > maxW) {
      f=1-((w - maxW) / w);
      pix[i].width=w * f;
      pix[i].height=h * f;
    }
  }
}

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
  fixImgs(200);  // Change this value to change maximum image width
});
</script>

Not my code - got it from http://javascript.internet.com/misce...e-resizer.html

[Kolbi]

Compiled and optimised:

<script type="text/javascript">
function fixImgs(b){var a=document.getElementsByTagName("img");for(i=0;i<a.length;i++)if(w=a[i].width,h=a[i].height,w>b)f=1-(w-b)/w,a[i].width=w*f,a[i].height=h*f}function addLoadEvent(b){var a=window.onload;window.onload=typeof window.onload!="function"?b:function(){a&&a();b()}}addLoadEvent(function(){fixImgs(200)});
</script>

[alwafi]

Hello Every one

very nice style

thanks

best regrad's

[tadukuttan]

Desktop/PCMode link does not seem to work with VB 4.1.3, every time user switches to Desktop Style, clicking any forum link causes style to switch back to Mobile/Lightweight style. I just changed default style chooser to have 'none' option with value '-1', similar to what VB mobile style uses to switch back to full style.

			<setting varname="ls_default_style" displayorder="20">
				<datatype>free</datatype>
				<optioncode>select:eval
$options = fetch_style_title_options_array();$options = array('-1' => $vbphrase['none']) + $options;</optioncode>
			</setting>

This works alright, please let me know if there is better fix.

[Robbed]

Thanks for the update dartho. The image resizer code works good.

[Alan_SP]

Originally Posted by tadukuttan

Desktop/PCMode link does not seem to work with VB 4.1.3, every time user switches to Desktop Style, clicking any forum link causes style to switch back to Mobile/Lightweight style. I just changed default style chooser to have 'none' option with value '-1', similar to what VB mobile style uses to switch back to full style.

This seems to be problem for some of my users. I'm waiting for confirmation if this solves their problem.

[dartho]

Good work around for 4.1.3, tadukuttan. I notice vbulletin.com also does this, choosing a styleid of -1 is the only way to break out of their mobile device detection so I think your solution is probably the fix - although I'd use text "Default Style" as opposed to "none"

[rwoscott]

I just upgraded VB to 4.1.3, from 4.1.1, and tried to upgrade the style, but get the following error.

Invalid File Specified

I have uninstalled the style, and tried a fresh install, bu tI still get the same error.

Any idea??

[dartho]

Have you tried re-downloading the zip and extracting it to a new location on your local computer before importing via the Style Manager?