Joomla Templates Club 406,261 posts

[testcouch Friend testcouchJoin date: October 2013Posts: 155Downloads:0Uploads:45 Thanks: 30 Thanked: 9 times in 1 posts]

#195654

hi, i’m during Layout Customization of JA Social and read the Tutorial http://www.joomlart.com/documentation/joomla-templates/ja-social-t3-framework but i do not achive what i need, with your Grid Setting in Theme Magic!

There is a limitation in flexibility. :((

Example:

I tried to get for sidebar-1 a different width then sidebar-2, also a fixed width for Content but i do not know how?

Default-Left-Content-Right

The Wide Layout Width is set to 1150px and Wide Gutter Width to 8px

1. sidebar-1 should 223px width
2. Content should 751px width
3. sidebar-2 should 160px width <— this width should be the rest of 1150px – 223+8+751+8

see screenshot

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#526464

Please look at this screenshot:

JA Social Template uses Bootstrap to deal with css style

+ Width of your site layout: 1144px ~ span12

+ sidebar-1 and sidebar-2 positions use span3

+ Main content is span6

+ Each span on your site: 88px.

And it’s very difficult to set them with width of your choice. Instead you can set them with width: span1, span2.. span12

---

Attachments:

1. 

[testcouch Friend testcouchJoin date: October 2013Posts: 155Downloads:0Uploads:45 Thanks: 30 Thanked: 9 times in 1 posts]

#527042

<em>@Ninja Lead 416027 wrote:</em><blockquote>

And it’s very difficult to set them with width of your choice. Instead you can set them with width: span1, span2.. span12</blockquote>

hi Ninja Lead, many thanks for your screenshot..can you please explain “Instead you can set them with width: span1, span2.. span12” a bit more!?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#527121

I meant you only set Width size on your site with span1, span2, span3…. span12. Please have a look at this link to learn more about span in bootstrap.

[testcouch Friend testcouchJoin date: October 2013Posts: 155Downloads:0Uploads:45 Thanks: 30 Thanked: 9 times in 1 posts]

#527354

<em>@Ninja Lead 416866 wrote:</em><blockquote>I meant you only set Width size on your site with span1, span2, span3…. span12. Please have a look at this link to learn more about span in bootstrap.</blockquote>

hmm..ok thanks for your link. but it is in general possible to set for sidebar-1 span3 and for sidebar-2 span4 and get for span4 a smaller width then span3? and will Main content span6 then get more width?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#527474

The maximum width on site should be span12. You can set the width among the range from span1 to span12, all columns are very flexible to set with spanX at your choice. However, it requires certain experience to work with Boostrap grid.

[testcouch Friend testcouchJoin date: October 2013Posts: 155Downloads:0Uploads:45 Thanks: 30 Thanked: 9 times in 1 posts]

#528085

<em>@Ninja Lead 417304 wrote:</em><blockquote>The maximum width on site should be span12. You can set the width among the range from span1 to span12, all columns are very flexible to set with spanX at your choice. However, it requires certain experience to work with Boostrap grid.</blockquote>

Layout left-content-right

there is one thing wich i still not unterstand..how can i achieve that main content span6 gets automatic more width if i change sidebar-2 from span3 to smaller span4? if span4 gets less width then should span6 automatic fill the gap..do you know what i mean?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#528231

The content may fill the gap but if you view the source code, you will see that it still have span6 so it’s best if you define each block with spanX clearly (make sure the total is span12)

[testcouch Friend testcouchJoin date: October 2013Posts: 155Downloads:0Uploads:45 Thanks: 30 Thanked: 9 times in 1 posts]

#528381

<em>@Ninja Lead 418293 wrote:</em><blockquote>The content may fill the gap but if you view the source code, you will see that it still have span6 so it’s best if you define each block with spanX clearly (make sure the total is span12)</blockquote>

ok thanks..wich files i have to change? is it possible to change only the spanx for Default-Left-Content-Right Layout or will this also effect other Layouts?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#528410

You can find and change it from the templates/tpls/blocks/mainbody-left-content-right.php file


$layout_config = json_decode ('{
"two_sidebars": {
"default" : [ "span9" , "span6" , "span3" , "span3" ],
"wide" : [],
"xtablet" : [ "span8" , "span8" , "" , "span4 spanfirst" ],
"tablet" : [ "span8" , "span8 spanfirst" , "" , "span4" ]
},
"one_sidebar1": {
"default" : [ "span12" , "span9" , "span3" ],
"wide" : [],
"xtablet" : [ "span8" , "span8" , "span4" ],
"tablet" : [ "span12" , "span12 spanfirst" , "span12" ]
},
"one_sidebar2": {
"default" : [ "span9" , "span9" , "span3" ],
"wide" : [],
"xtablet" : [ "span8" , "span8" , "span4" ],
"tablet" : [ "span12" , "span12 spanfirst" , "span12" ]
},
"no_sidebar": {
"default" : [ "span12" ]
}
}');


Be careful when editing as it might break your layout.

[Author]

Posts