Joomla Templates Club 406,261 posts

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#193420

Hi, am testing a new joomla 2.5 site with ja-magz. demo site on this url-
http://jcdemo34-25.cloudaccess.net/

Would like the navbar to be as wide as possible. with full 1920px wide screen/browser window, navbar wraps on to two lines, which I don’t want- but as I reduce screen width the navbar FINALLY fits on one line and then as I narrow width down it wraps again on to two lines. Can you please advise if this can be changed? Also getting strange ‘You may also like’ article links on most article pages, such as on this page-

http://jcdemo34-25.cloudaccess.net/celebration-cakes.html

Have tried lots of joomla settings but cannot get rid of these. Thanks in advance for any assistance you can offer!

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#517192

You can try this . . . .

Within file path –> /templates/ja_magz/css/themes/pink/template.css
at line 1848, add a “width” property – for example . . .


.t3-mainnav .navbar .t3-megamenu .nav {
margin-top: 10px !important;
width: 900px;
}

Hope That Helps

😎

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517258

Hi, thanks for your suggestion- I added this to a custom.css file in the appropriate directory, to avoid messing with the standard settings, but does not seem to make any improvement. Can you offer any other suggestions? thanks
!

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#517312

<em>@tombreen 404348 wrote:</em><blockquote>Hi, thanks for your suggestion- I added this to a custom.css file in the appropriate directory, to avoid messing with the standard settings, but does not seem to make any improvement. Can you offer any other suggestions? thanks
!</blockquote>
You could try my original suggestion above – to see if it works for you.

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517347

Hi again, have implemented your solution and it does help, but when the width of the browser is reduced, at a certain point the
menu goes to double depth and then as the width is further reduced, it is not displayed at all. Is there a way of increasing the no of columns/spans of the mainmenu? Also I would be grateful if you could help with the ‘you may also like’ content which appears on all the articles/pages I am building with the ja-magz template. Thanks…

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517391

Hi again, just wanted to clarify what I am trying to achieve- on a desktop/wide display, suppress display of sidebar/symbol, and get a wide navbar to allow access to main sections. On tablet and/or mobile phone, disable navbar and implement sidebar. Also want logo visible on all devices/layouts. What I am getting right now is that navbar is wrapping around to 2 lines, which is confusing, and on ipad navbar is wrapping on new line below the sidebar ‘button’. Apologies for rambling, it’s quite tricky to describe the problem…

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517447

@ Tombreen,

Regarding to 2 main questions in your previous post, I wish to add more clarifications as follows:

<blockquote> Is there a way of increasing the no of columns/spans of the mainmenu?</blockquote>
– First, please backup files you are about to change below
– Open …templates/ja_magz/tpls/blocks/header.php file and find lines:

<div class="header-menu <?php echo $hassocial ? 'span6' : 'span10' ?> nav-collapse collapse <?php echo $this->getParam('navigation_collapse_showsub', 1) ? 'always-show' : '' ?>">
<?php if ($this->getParam('navigation_type') == 'megamenu') : ?>
<jdoc:include type="megamenu" name="mainnav" menutype="<?php echo $this->getParam('mm_type', 'mainmenu') ?>" />
<?php else : ?>
<div class="mainnav-wrap <?php $this->_c('mainnav') ?>">
<jdoc:include type="modules" name="mainnav" style="raw" />
</div>
<?php endif ?>
</div>

Increase the span width of navigation as you want, but make sure the total span of logo, navigation and head-social module is 12.

<blockquote>Also I would be grateful if you could help with the ‘you may also like’ content which appears on all the articles/pages</blockquote>

You just need to enable the Related Articles option inside Extended Settings of Template Manager. The ‘you may also like’ will display the related articles in a same category. Make sure you publish at least 2 articles per a category.

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517518

Hi again, could you help by clarifying the change/s I need to make to the header.php file- I cannot find a span for the navbar, for example. I see the line-
<div class=”header-menu <?php echo $hassocial ? ‘span6’ : ‘span10’ ? etc. but not sure if either of these value is relevant. Thanks!

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517531

Hi Tom,

You can change the span width of navigation (Header menu):

<div class=”header-menu <?php echo $hassocial ? ‘span6‘ : ‘span10’

to

<div class=”header-menu <?php echo $hassocial ? ‘span7‘ : ‘span10’

Then you need to decrease the span of head social module to:

<div class=”span3 head-social pull-right”>

Lets try it and tell me what it goes

1 user says Thank You to phong nam for this useful post

1. VS

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517546

Hi again (Leo?), a bit confused now… I get that I can control the width of the navbar by editing the line in template.css-
.t3-mainnav .navbar .t3-megamenu .nav {
width: 1000px;
}, which is OK for desktop and laptops with wide screens. My problems/ relate mainly to tablet/mobile, where I would like to have the full width navbar for ipad in landscape mode, but for ipad in portrait/mobile devices, I would like the navbar to be suppressed but the sidebar working. Also really need my logo and address text visible too. (These are in positions top-1 and home-10) Thanks again! the url of the test site is http://jcdemo34-25.cloudaccess.net/

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517602

@ Tom, It requires heavy modification on JA Magz header section since we will need to override the css styles of header elements (logo, navigation) on mobile, tablet with both landscape and portrait view. I would suggest you hire an experienced developer to help you with this.

Anyway, I still add some notes below in case you want to play around:

– The logo should be defined as a background image of .logo-image a instead of creating a Custom HTML module with logo image. It will be easier for background image to be responsive than a module containing the image.

– A helpful tip on using the media queries for common devices instructed at http://code-tricks.com/css-media-queries-for-common-devices/. You can create a custom.css file in …template/ja_magz/css/ path and add to this file the override css styles mentioned in the tip.

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#517779

thanks- would this be more straightforward with another template? for example, tried a free template called zenbase, which did have some problems, does have the merit of elegant collapsing/scaling of logo and address block on all devices including tablet/portrait/landscale and mobile…

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517993

I think it is possible. You can apply the @query media to adjust your logo and address blocks on ZenBase template. However, It will be great when you can raise a question on JoomlaBamboo forum to get better advices from their developers on this.

[tombreen Friend tombreenJoin date: January 2013Posts: 9Downloads:0Uploads:0]

#518060

Thanks Leo, of course it would not be reasonable to ask you for support on another supplier’s templates. Just pointing out that in that aspect the zenbase template solves a problem that seems (almost) insurmountable on ja_magz. Are there any other templates in the joomlart range that might address this problem? thanks, Tom

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#518082

Hi Tom,

Generally, the problem always comes from the modification of JA members on our template. For instance, with the bigger logo size and more menu items on navigation can cause the header block layout of your current site look not good as our template demo on responsive devices. That is why I can ensure that there are no template demos of us getting this problem. Hope you understand this ! 🙂

[Author]

Posts