Joomla Templates Club 406,261 posts

[nkamp Friend nkampJoin date: March 2006Posts: 32Downloads:6Uploads:2 Thanks: 5 Thanked: 3 times in 1 posts]

#192973

Hello,

I was busy for more than a month with something else and I’m now going further witn this project. I get the idea that it is hard to change the layout, it is not easy to find were is created what. My objection about the layout for wordpress was that the layout was created not always clearly and in to much different files. I have the idea that we go with Joomla 3 the same direction. I have changed already css/php in the template directory but also at the plugin/system/ta3/ta3/basic theme. I think I have to move these files to the html dir from my template or not? otherwise with a upgrade of the template al my changes are lost!

Next my question about changing the layout:

I have changed the header with extra row. That was not difficult to find and to do.
But now we want to have the slider in the full width and the content centered and keep it smaller, let say 940px.

So I thought I have change this:

<div class="main-inner1">
<div class="main-inner2 clearfix">
<div class="ja-box column ja-box-left" style="width: 25%; min-height: 220px;">
<div class="ja-box column ja-box-center" style="width: 37.5%; min-height: 220px;">
<div class="ja-box column ja-box-right" style="width: 37.5%; min-height: 220px;">
<script type="text/javascript">
</div>
</div>

To:

<div class="main-inner1">
<div class="ja-box column ja-box-left" style="width: 25%; min-height: 220px;">
<div class="main-inner2 clearfix">
<div class="ja-box column ja-box-center" style="width: 37.5%; min-height: 220px;">
<div class="ja-box column ja-box-right" style="width: 37.5%; min-height: 220px;">
<script type="text/javascript">
</div>
</div>

So that I can position ja-box-left (user1, user5, user7 and user 9) a little more to the left to have more space between user1 and user 2 position and also between user 5 and user 6 etc. And then user2 -user4, user6, user8 and user10/12 centered and width 940px.

I think I can’t do it only by the class main / main-inner1 because then I can’t get my slider full width or…do I think to difficult?

Important keep it responsive.

We had already the idea before but last week I saw more or less what we want.

Where can I find these in the code? I’m searching me wild but I get the idea that is not simple to change..

I hope that someone can help me.

********************************* EDIT – EDIT *********************************

Ok, I have find now something default.xml en the xml’s I think I can change something.
But then why is there a header.php so that can add a row and these layout is in blocks.
Maybe I will find out but on this moment I don’t know how get a block for example out the inner-2 and that the layout still looks good.

How can I create user1 till user four on one row while user1 is seperated from main-inner2 (user2, 3 and 4), so that can move user1 position to the left, independent from main-inner2:

<block name="user1" type="modules" main-inner="1">user1</block>
<block name="topsl" type="spotlight" main-inner="2" specialwidth="25" special="left"> user2,user3,user4</block>

Is that possible?

This doesn’t work:

<block name="user1" type="modules" main-inner="1">user1
<block name="topsl" type="spotlight" main-inner="2" specialwidth="25" special="left"> user2,user3,user4</block>
</block>

If so, than I want to this for user 5, 7 and user 9 position as well.

What is the difference between type modules and spotlight?

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

#515560

You are mentioning about position layout on JA Puresity template and JAT3v2 framework.

+ You need to understand about JAT3v2 framework and redefine new position on JA template
+ In JAT3v2 framework is defined top, middle, bottom blocks but top and bottom blocks you can define new position in it easy with format

<blockquote><block name=”newposition” type=”modules” main-inner=”1″>newposition</block></blockquote>

With middle blocks new position must correlate with format of middle position here and screenshot position of the middle here

+ What is the difference between type modules and spotlight?

module type: is block generators used to create blocks for special module positions needed by advertising modules, content sliders, etc; – See more at: http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides#Block_attributes_and_parameters


<block name="slider" type="modules" main-inner="1">slider</block>


spotlight type: is a block generator script to be used as top spotlight or bottom spotlight, no matter how much spotlight blocks you may want to us – See more at: http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides#Block_attributes_and_parameters

<block name="topsl" type="spotlight" main-inner="2">user1,user2,user3,user4</block>

user1,user2,user3,user4: is the same width on topsl blocks

[nkamp Friend nkampJoin date: March 2006Posts: 32Downloads:6Uploads:2 Thanks: 5 Thanked: 3 times in 1 posts]

#515783

I have read the wiki page, but it is not all clear to me.

I try to make it more clear what I want – see attachemnt.

In this way I can move with css, user 1 independent of Main-inner2.

I try this:

<block name="topsl" type="modules" main-inner="1">
<block name="topsl11" type="spotlight" main-inner="2" specialwidth="25" special="left">user1</block>
<block name="topsl12" type="spotlight" main-inner="2" specialwidth="25" special="left">user2,user3,user4</block>
</block>

But nothing is shown then.

And what I want is the header (=menu) with the slider 100% width. I have realized this at the moment but then on the other 3 pages (2 content article and 1 contact) everything is 100% width as well, because of making the main class 100% width. This is not what I want.
I understand why, because I have made the main width 100% in stead of 960px and max-width 1200 or 1260px width.

I don’t if it is necessary but I was thinking of creating a copy of the template. And then one template for the home page and the copy of the template for the other 3 pages.

I will try further, but to change simply the layout a little, is hard to understand for me. I’m developer, I understand xml, php, javascript etc. But on this moment I can’t follow how the template is created from xml with PHP.

Nico

---

Attachments:

1. 

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

#515827

I would like to clarify that this will requires much customization from php code and css style. If you are a developer you can try to do with my suggestion

+ Create templates/ja_puresite/blocks/new-block.php file

+ Copy and paste script below into whole new-block.php file


<?php if($this->countModules('user1')) : ?><jdoc:include type="modules" name="user1" /><?php endif; ?>
<div class="main-inner2">
<?php if($this->countModules('user2')) : ?><jdoc:include type="modules" name="user2" /><?php endif; ?>
<?php if($this->countModules('user3')) : ?><jdoc:include type="modules" name="user3" /><?php endif; ?>
<?php if($this->countModules('user4')) : ?><jdoc:include type="modules" name="user4" /><?php endif; ?>
</div>

+ Open templates/ja_puresite/etc/layouts/default.xml file

Change
<blockquote><block name=”topsl” type=”spotlight” main-inner=”2″ specialwidth=”25″ special=”left”>user1,user2,user3,user4</block></blockquote>
To
<blockquote><block name=”new-block” type=”new-block” main-inner=”1″></block></blockquote>

1 user says Thank You to Ninja Lead for this useful post

1. nkamp

[nkamp Friend nkampJoin date: March 2006Posts: 32Downloads:6Uploads:2 Thanks: 5 Thanked: 3 times in 1 posts]

#516081

Hello Ninja,

Thanks this is what I want for my home page. And the code simple to understand!!!! Tonight I’m gonna try to get this work for the content article and the contact form.

But first I have to make this smaller because I have taken out of the .main class the width:960px and the max width:12xxpx, because the designer want to have the menu/slider full width.

But I hope that it is possible to create a ‘user1’, ‘user5, ‘user7’ left next to the content article/contact form. I think the content article is difficult. But maybe I can realize this with a table in the content or with K2?

With Regards,

Nico

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

#516399

Apologies for this late response, somehow I missed this thread.

<blockquote>But first I have to make this smaller because I have taken out of the .main class the width:960px and the max width:12xxpx, because the designer want to have the menu/slider full width.</blockquote>

Yes, you can change width:960px from .main class and menu/slider will be increased auto width.

<blockquote>But I hope that it is possible to create a ‘user1’, ‘user5, ‘user7’ left next to the content article/contact form</blockquote>

You can add “user1“, “user5“, “user7” left next to the content article/contact form but you need to style css them to showing left content article. This is the solution to add new position into left content article/contact form.

Open templates/ja_puresite/etc/layouts/default.xml file

Change


<blocks name="middle" main-inner="1" fixheight="0" colwidth="25">
<block name="left1">user100</block>
<block name="right1">position-7, position-5</block>
</blocks>


To


<blocks name="middle" main-inner="1">
<block name="left1">user1, user5, user7</block>
<block name="right1">position-7, position-5</block>
</blocks>


[Author]

Posts