WebsiteBaker Logo
  • *
  • Templates
  • Help
  • Add-ons
  • Download
  • Home
*
Welcome, Guest. Please login or register.

Login with username, password and session length
 

News


WebsiteBaker 2.13.6 is now available!


Will it continue with WB? It goes on! | Geht es mit WB weiter? Es geht weiter!
https://forum.websitebaker.org/index.php/topic,32340.msg226702.html#msg226702


The forum email address board@websitebaker.org is working again
https://forum.websitebaker.org/index.php/topic,32358.0.html


R.I.P Dietmar (luisehahne) and thank you for all your valuable work for WB
https://forum.websitebaker.org/index.php/topic,32355.0.html


* Support WebsiteBaker

Your donations will help to:

  • Pay for our dedicated server
  • Pay for domain registration
  • and much more!

You can donate by clicking on the button below.


  • Home
  • Help
  • Search
  • Login
  • Register

  • WebsiteBaker Community Forum »
  • WebsiteBaker Support (2.8.x) »
  • Templates, Menus & Design »
  • Resposive or mobile friendly template
  • Print
Pages: [1] 2   Go Down

Author Topic: Resposive or mobile friendly template  (Read 36288 times)

apple

  • Guest
Resposive or mobile friendly template
« on: April 29, 2015, 04:28:46 PM »
I am looking for a mobile friendly template. Is there one available? My site design is nice looking when I first designed it but now it so ugly on mobile. It is all over the place and look terrible. Suggestion and help please. Thanks
Logged

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Resposive or mobile friendly template
« Reply #1 on: April 29, 2015, 04:38:50 PM »
Here are some really nice free responsive templates: http://WebsiteBaker.at/wb-templates/
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #2 on: April 30, 2015, 09:24:42 AM »
Quote from: nibz on April 29, 2015, 04:38:50 PM
Here are some really nice free responsive templates: http://WebsiteBaker.at/wb-templates/
Hi, are you referring to this template as seen or I can get some from this site?
Thanks
Logged

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Resposive or mobile friendly template
« Reply #3 on: April 30, 2015, 10:30:19 AM »
On a desktop you should see a sidebar on the right hand side, there you can search for templates.
Or here are the top downloads for this month: http://WebsiteBaker.at/wb-templates/search/top30-downloads.html (NOT ALL ARE RESPONSIVE!)

Logged

fischstäbchenbrenner

  • Guest
Re: Resposive or mobile friendly template
« Reply #4 on: April 30, 2015, 10:45:34 AM »
Here are all Responsive Templates:
http://www.WebsiteBaker.at/wb/responsive-templates.html

Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #5 on: April 30, 2015, 03:55:41 PM »
Thank you guys. That was very helpful. I will at them. Are the templates restricted to wb version. My wb version is rather old.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #6 on: May 11, 2015, 12:05:48 PM »
Quote from: nibz on April 30, 2015, 10:30:19 AM
http://WebsiteBaker.at/wb-templates/search/top30-downloads.html
Is this particular template responsive? I like the left column. I would like to add submenu to it. The submenu needs to appear on all pages. How can I do that? How will it shows on mobile screen if I do?
This venture proved to be more challenge than I realised.


Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #7 on: May 11, 2015, 04:03:20 PM »
Hi,

the template repository shows its pages in the last template you personally tested, so nobody else knows which template you mean. Please tell us the name of the template.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #8 on: May 11, 2015, 11:52:11 PM »
Quote from: instantflorian on May 11, 2015, 04:03:20 PM
Hi,

the template repository shows its pages in the last template you personally tested, so nobody else knows which template you mean. Please tell us the name of the template.


Oops, it is the responive blue and daflekk. Particularly the daflekk.
Thanks
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #9 on: May 12, 2015, 12:27:15 AM »
Particularly the daflekk. http://WebsiteBaker.at/wb-templates/example.html
Thanks
Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #10 on: May 12, 2015, 08:11:35 AM »
See attachment.
I just changed the float of the former right column to float:left and removed the checks if the 2nd block has content, so the column is always shown.
On small screens, the left column is shown beyond the main content.
The sub menu needs some more styling of course.

I guess the same way responsive blue could be modified.

Generally spoken, a left column for showing the sub navigation is not particularly needed as all childpages are listed in the main navigation bar.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #11 on: May 12, 2015, 03:47:06 PM »
Quote from: instantflorian on May 12, 2015, 08:11:35 AM
Generally spoken, a left column for showing the sub navigation is not particularly needed as all childpages are listed in the main navigation bar.
Thanks for taking the time to fix this. Greatly appreciated. I think what I needed is the sub-menus showing on all the pages on the left. Your template is not showing at the moment. I don't want showing from the main menu.  How can I get it showing on all the pages? Cheers
Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #12 on: May 12, 2015, 03:57:10 PM »
Have a look at the index.php of the template, at line 91ff. you'll find two show_menu calls.
Refer to Tutorial link removed 404 to find out how to change the sm2 calls to show only the root elements in the main navigation and always the child elements in the left column.
« Last Edit: December 31, 2017, 03:16:44 PM by Luisehahne »
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #13 on: May 12, 2015, 05:32:55 PM »
Quote from: instantflorian on May 12, 2015, 03:57:10 PM
Have a look at the index.php of the template, at line 91ff. you'll find two show_menu calls.
Hi again, I spent last few hours trying to work this out. I have used show_menu2(0, SM2_ROOT+1, SM2_START, SM2_ALL for the childpages and my result show:
[a][menu_title]
[a][menu_title]
[a][menu_title]
[a][menu_title]
[a][menu_title]
[a][menu_title]

Any idea where went wrong?  :?
Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #14 on: May 12, 2015, 07:19:38 PM »
Looks for me like an error with the ' signs in the SM2 call.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #15 on: May 15, 2015, 12:09:37 AM »
Quote from: instantflorian on May 12, 2015, 07:19:38 PM
Looks for me like an error with the ' signs in the SM2 call.
It still doesn't make sense to me. Do you mind have a look and let me know where I have gone wrong please? My code at present below.

   /*Men?s*/
   ob_start();
   
   show_menu2(1, SM2_ROOT, SM2_ALL, SM2_ALL, '<li class="[class]"><a href="[url]" class="[class]"><span>[menu_title]</span></a>', "</li>", '<ul>', '<li class="ulend"></li></ul>', true, '<ul id="mobile" class="nav">');
   $topmenu = ob_get_contents();
   ob_end_clean();
      
   $childpages = '';   
   ob_start();
   show_menu2(0, 19, SM2_ALL, SM2_ALL, '', '<li class="[class]">[a][menu_title]</a></li>', '', '', '', '');   
   $childpages = ob_get_contents();   
   ob_end_clean();    
   
?>
Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #16 on: May 15, 2015, 07:55:47 AM »
Your sm2 calls are wrong. You added an page id at the 2nd position, so the other parameters are not at the right place any more. The order and position of the parameters are very important.

When modifying and testing, it might be easier to use the "long call" with the variable names, so you see at once where to change what:

Code: [Select]
<?php
show_menu2
(
    
$aMenu          = 0,
    
$aStart         = SM2_ROOT,
    
$aMaxLevel      = SM2_CURR+1,
    
$aOptions       = SM2_TRIM,
    
$aItemOpen      = '[li][a][menu_title]</a>',
    
$aItemClose     = '</li>',
    
$aMenuOpen      = '[ul]',
    
$aMenuClose     = '</ul>',
    
$aTopItemOpen   = false,
    
$aTopMenuOpen   = false
    
)

So in your case sth. like this

Code: [Select]
<?php
show_menu2
(
    
$aMenu          = 0,
    
$aStart         = 19,
    
$aMaxLevel      = SM2_ALL,
    
$aOptions       = SM2_ALL,
    
$aItemOpen      = '<li class="[class]">[a][menu_title]</a></li>',
    
$aItemClose     = '',
    
$aMenuOpen      = '',
    
$aMenuClose     = '',
    
$aTopItemOpen   = false,
    
$aTopMenuOpen   = false
    
)

Furthermore, it usually doesn't make sense to hardcode the page id for the start of a submenu into the template. In your code (if it would be working), you would see the childpages of page 19 on every other page too. I'm not sure if it is that what you wanted to reach.

The menu configuration is probably the most complicated point of building a WB template.
You will find more information and typical menu calls here in the forum (german)

Edit:
See also here
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #17 on: May 16, 2015, 04:39:50 PM »
Quote from: instantflorian on May 15, 2015, 07:55:47 AM

Furthermore, it usually doesn't make sense to hardcode the page id for the start of a submenu into the template. In your code (if it would be working), you would see the childpages of page 19 on every other page too. I'm not sure if it is that what you wanted to reach.

The menu configuration is probably the most complicated point of building a WB template.
You will find more information and typical menu calls here in the forum (german)
Hi, the codes works fine on my old template. Yes, that's correct. I want all the child pages showing on all my pages. I am trying to implement the same thing on the template  daflekk or responsive-blue but it doesn't work on them.
Sorry, I can't read German :(
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #18 on: May 16, 2015, 06:30:42 PM »
I have attached an image to explain what I am trying to achieve. The submenu or childpages showing on all pages. Can anyone help please? Tried the suggestions and still not working. I am not an expert in this and can't find my head round it. Thanks.
Logged

Offline DarkViper

  • Forum administrator
  • *****
  • Posts: 3087
  • Gender: Female
Re: Resposive or mobile friendly template
« Reply #19 on: May 16, 2015, 07:17:19 PM »
try this .. maybe it helps..
Code: [Select]
<?php
// create main menue
    
$sMainNavi = show_menu2(
        
1,
        
SM2_ROOT,
        
SM2_START + 1,
        
SM2_ALL|SM2_PRETTY|SM2_CURRTREE|SM2_BUFFER, 
        
'<li class="[class]"><a href="[url]" class="[class]" title="">[if(class==menu-current && level>1){&#38;#10144;&nbsp;}][menu_title]</a>',
        
'</li>',
        
'<ul class="[class]">',
        
'</ul>',
        
'<li class="[class]"><a href="[url]" class="[class]" title="">[menu_title]</a>',
        
'<ul class="[class]">'
    
);
// create sub menue title
    
$sSubNaviTitle = show_menu2(
        
1,
        
SM2_ROOT,
        
SM2_START,
        
SM2_TRIM|SM2_BUFFER,
        
'[if(class = menu-current || class = menu-parent){[menu_title]}]',
        
'',
        
'',
        
'',
        
'',
        
''
    
);
// remove possible comments and whitespaces from result 
    
$sSubNaviTitle = trim(preg_replace('/<\!--.*?-->/siu', '', $subMenuTitle));
// create main menue sub
    
$sSubNavi = show_menu2(
        
1, SM2_ROOT+1, SM2_CURR+1, SM2_SIBLING|SM2_CURRTREE|SM2_PRETTY|SM2_BUFFER,
        
'[li][ac][if(class==menu-current){&#38;#10144;&nbsp;}][menu_title]</a>',
        
'</li>',
        
'<ul>',
        
'</ul>',
        
'',
        
''
    
);
// remove possible comments and whitespaces from result 
    
$sSubNavi = trim(preg_replace('/<\!--.*?-->/siu', '', $sSubNavi));
// show all
echo '<div>'.$mainNavi.'</div>';
// [...] output something others
if ($sSubNavi) { // show submenu only if sub items exists
    
echo '<div>'.$sSubNaviTitle.'</div>';
    echo 
'<div>'.$sSubNavi.'</div>';
}


Manuela
« Last Edit: May 16, 2015, 11:43:58 PM by DarkViper »
Logged
Der blaue Planet - er ist nicht unser Eigentum - wir haben ihn nur von unseren Nachkommen geliehen

"We need education to cope with digitalization - and NOT the digitalization of education.!"

Tägliches Stoßgebet: Oh Herr, wirf Hirn vom Himmel !

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #20 on: May 17, 2015, 08:36:46 AM »
The following finally should do the trick. It shows in the left column permanently all child items of page 19.

Code: [Select]

/*Menüs*/
ob_start();
show_menu2(
    $aMenu          = 0,
    $aStart         = SM2_ROOT,
    $aMaxLevel      = SM2_START,
    $aOptions       = SM2_ALL,
    $aItemOpen      = '<li class="[class]"><a href="[url]" class="[class]"><span>[menu_title]</span></a>',
    $aItemClose     = '</li>',
    $aMenuOpen      = '<ul>',
    $aMenuClose     = '<li class="ulend"></li></ul>',
    $aTopItemOpen   = true,
    $aTopMenuOpen   = '<ul id="mobile" class="nav">'
    );
$topmenu = ob_get_contents();
ob_end_clean();



$childpages = '';
ob_start();
show_menu2(0,19, SM2_ALL, SM2_ALL, '<li class="[class]">[a][menu_title]</a></li>', '', '', '', '');
$childpages = ob_get_contents();
ob_end_clean();


In the 2nd menu call it's important that there's no " ,'' " after the 2nd SM2_ALL! Otherwise you well get the wrong "[a] [menu]" output. I've tested it.

You should maybe change the line

Code: [Select]
<div id="leftboxdesktop" class="leftbox desktops_only"><div class="inner">

to
Code: [Select]
<div id="leftboxdesktop" class="leftbox"><div class="inner">

otherwise the left column is not displayed on mobile devices.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #21 on: May 17, 2015, 06:25:42 PM »
Hi, thanks for these. I tried DarkVioer's suggestion and my page came out blank. Tried instantflorian's codes and only the main horizontal menu showing, not the submenus. Here is my index file. I can't understand what is going on.
Logged

instantflorian

  • Guest
Re: Resposive or mobile friendly template
« Reply #22 on: May 17, 2015, 06:57:24 PM »
No idea what's wrong, sorry. It's exactly the same code as in my test website, where it is working like (I guess) it should.
How does your site structure looks like?
Is page #19 in the root or ab sub page of another page?
Do you use different menues?
Which WB version do you use? If it is very, very old, there might have been changes to the sm2 module (which might explain why your existing code works and the new one doesn't).
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #23 on: May 18, 2015, 04:44:40 PM »
Hi, the version may be an issue. It is a fairly old version 2.7. Could this be the problem? The present site works perfectly but it is not responsive. I am trying to update the template only without going through too much trouble.
Thanks.
Logged

apple

  • Guest
Re: Resposive or mobile friendly template
« Reply #24 on: May 18, 2015, 06:51:03 PM »
Quote from: instantflorian on May 17, 2015, 06:57:24 PM
How does your site structure looks like?
Is page #19 in the root or ab sub page of another page?
Do you use different menues?
Which WB version do you use? If it is very, very old, there might have been changes to the sm2 module (which might explain why your existing code works and the new one doesn't).
Hi, I got it working now using below:

$childpages = '';   
   ob_start();
   show_menu2(0, SM2_ROOT+1, SM2_START, SM2_ALL, '<li class="[class]">[a][menu_title]</a></li>', '', '', '', '');   
   $childpages = ob_get_contents();   
   ob_end_clean();   

The only thing is that all my submenus have bullet points which I do not want. Can you tell me how to remove them. 
Thanks
Logged

  • Print
Pages: [1] 2   Go Up
  • WebsiteBaker Community Forum »
  • WebsiteBaker Support (2.8.x) »
  • Templates, Menus & Design »
  • Resposive or mobile friendly template
 

  • SMF 2.0.19 | SMF © 2017, Simple Machines
  • XHTML
  • RSS
  • WAP2