Help needed with mystore layout

I'm very new to joomla, i've searched the forum but cannot find an answer to what I want to do, i installed the mystore template and its working fine, however I want to move the 3 boxes (we love our sale, crystal solaris, iphone 4 coming soon) currently under the photoslide show to the bottom of the page just above the footer.

How can I do this?

Any advice would be appreciated.

Thanks

Is there anyone that can offer a bit of help with this?

I've moved the parts to the bottom however what I would like is the space and this part blocked off.

as you can see in the screenshot there is no space anymore between the grey blocks



The parts I am referring to are shown in this picture. Just the top blue arrow gap, but would like to make the bottom gap smaller to be the same size as the top one.



Thanks

oook my head is going to stop spinning in a minute, but while it's winding down, put a link here to the site so I can see the css.

thanks for the reply

the site address is www.beyondav.co.uk

I'm not sure of what you need but this will allow you to change the margins on that block of module positions

Code: Select all


/templates/gk_mystore/css/layout.css (line 55)


.main .inner {
padding-top: 16px;
padding-right: 16px;
padding-bottom: 16px;
padding-left: 16px;
}

You can add margins to this, either negative or positive values

Code: Select all


/templates/gk_mystore/css/layout.css (on line 55)


.main .inner {
margin-top: -5px;
/**
* margin-top will control the top of that block that you want to move.
* Play with the values to suite your needs.*/   
margin-bottom: -5px;
/**
* margin-bottom will control the bottom of that block that you want to move.
* Play with the values to suite your needs.*/
padding-top: 16px;
padding-right: 16px;
padding-bottom: 16px;
padding-left: 16px;
}

Hi I couldnt get it to make any difference using them settings, I've modified the link now to make it easier to understand what I want to do. I've moved one of the boxes to the original position (yes we love our sale box)

That box is in its own block, seperated from the blocks above and below so you can see the background and it looks sectioned off.

however at the bottom its just an extension of the virtuemart grey block.

Ideally i'd like a small gap which you'd see the background and then a block with the 3 blocks at the bottom

does that make it clearer?

thanks for your help.

Ok I get what you want now, now this is some serious customization.. give me about 10 minutes to work out the code and changes needed.

Thanks very much, I presumed it would be a small change

Appreciated.

Sorry it took so long.. the damned cat unplugged my computer. I think this is what you want. You can see it at the bottom of my test site. http://balla.umaballa.com/index.php

ok here we go..

1. go to /mystore/layouts/default.php I need you to open this file and look for.

Code: Select all

<!-- FOOTER -->

We need to turn this into.

Code: Select all

<?php $this->loadBlock('topsla') ?>
      <!-- FOOTER -->


All done here you can close it and upload.

2. I need you to go to /mystore/templateDetails.xml
open the file and look for.

Code: Select all

                        <position>top1</position>

                        <position>top2</position>

                        <position>top3</position>

                        <position>top4</position>

                        <position>top5</position>

                        <position>top6</position>

                        <position>top7</position>

                        <position>top8</position>

Right under this I need you to paste this.

Code: Select all

                        <position>top1a</position>

                        <position>top2a</position>

                        <position>top3a</position>

                        <position>top4a</position>

                        <position>top5a</position>

                        <position>top6a</position>

                        <position>top7a</position>

                        <position>top8a</position>

Ok we're done here, save, and upload this file.

3. I have created a file you need to upload to the server this file holds 8 new module positions. It's called topsla.php. Put this file in:

Code: Select all

/mystore/layouts/blocks

when you get done with these steps you'll have this. http://balla.umaballa.com/index.php

Thanks for that, looks like it took a bit of time, Really appreciated.

Will give it a go after I eat,

Thanks again

akis2001 wrote:

Thanks for that, looks like it took a bit of time, Really appreciated.

Will give it a go after I eat,

Thanks again

Don't thank me because it was pretty easy thanks to Gavicks code structure. It was actually done 2 times because I was about to push submit the last time I did it when the cat ran by the plug. Just study code so you can add your own modules and I'll be happy.

It worked perfectly, thanks a lot. I'm gonna take a look at that code because you seem to have made it look really easy to add modules.

looks good mongo2006... i've changed the title of your post to make easier to search. think this can help alot of people making there own positions

just one quick question, I did all the above, I added the 3 images to the postitions top1 top2 and top3 however 1 image has disappeared and the other 2 are pretty wide.
All the positions are loaded so I'm a bit stuck as to whats gone wrong.

Was too rushed to post that I hadnt got it working, its all sorted.

Thanks again

I think you've made it a lot easier for me to add more modules when I need to

@ Explodedk: Thanks bro, glad I could help a few people. I'd rather teach a person to fish than let him eat all my goodies up


@ akis2001: Ok cool bro I'm glad you got it working I was about to rack my brain as to why it wasn't

If anyone does try this and has one missing, it was simply it just wasnt activated in the menu assignement.

out of interest if I wanted them without the gaps as shown in the image below so it just looks like one big block, is that a simple process, if so how would I do it?



Thanks

Well sense this my help a few people lets finish this. Gavick has made the code very modular. Lets say you only wanted 4 modules instead of 8 you could:


cut this out of the file I supplied.

Code: Select all

,'top5a','top6a','top7a','top8a'

and then cut this out:

Code: Select all

         <?php if( $this->countModules('top5a') ): ?>

         <div class="gk-box column gk-box<?php echo $topsl1['top5a']['class']; ?>" style="width: <?php echo $topsl1['top5a']['width']; ?>;">

            <jdoc:include type="modules" name="top5a" style="gavickpro" />

         </div>

         <?php endif; ?>

         <?php if( $this->countModules('top6a') ): ?>

         <div class="gk-box column gk-box<?php echo $topsl1['top6a']['class']; ?>" style="width: <?php echo $topsl1['top6a']['width']; ?>;">

            <jdoc:include type="modules" name="top6a" style="gavickpro" />

         </div>

         <?php endif; ?>

         <?php if( $this->countModules('top7a') ): ?>

         <div class="gk-box column gk-box<?php echo $topsl1['top7a']['class']; ?>" style="width: <?php echo $topsl1['top7a']['width']; ?>;">

            <jdoc:include type="modules" name="top7a" style="gavickpro" />

         </div>

         <?php endif; ?>

         <?php if( $this->countModules('top8a') ): ?>

         <div class="gk-box column gk-box<?php echo $topsl1['top8a']['class']; ?>" style="width: <?php echo $topsl1['top8a']['width']; ?>;">

            <jdoc:include type="modules" name="top8a" style="gavickpro" />

         </div>

         <?php endif; ?>   

Now that file will have 4 module positions.


Notes:


you MUST rename all instances of the module positions so that they have their own positions. If you want to add more positions.

IE: top5a would have to be changed to top5b for example, anything but top5a.

and the module position would have to reflect this as well.

IE:

Code: Select all

<?php if( $this->countModules('top5a') ): ?>

         <div class="gk-box column gk-box<?php echo $topsl1['top5b']['class']; ?>" style="width: <?php echo $topsl1['top5b']['width']; ?>;">

            <jdoc:include type="modules" name="top5b" style="gavickpro" />

         </div>

         <?php endif; ?>


You would have to rename the position variable on all modules and then put those positions in templateDetails.xml

Find this is template.css on (line 148)

Mind you I would not advise this.. I don't know how far this rabbit goes down the css hole. looks like it will also do this to the top modules too.

Code: Select all

#gk-botsl1 .gk-box-center > div, #gk-topsl1 .gk-box-center > div
{

margin-top: 0pt;

margin-right: 10px;

margin-bottom: 0pt;

margin-left: 10px;

padding-top: 8px;

padding-right: 8px;

padding-bottom: 8px;

padding-left: 8px;

}

change it to:

Code: Select all

#gk-botsl1 .gk-box-center > div, #gk-topsl1 .gk-box-center > div
{

margin-top: 0pt;

margin-right: 0px;

margin-bottom: 0pt;

margin-left: 0px;

padding-top: 8px;

padding-right: 8px;

padding-bottom: 8px;

padding-left: 8px;

}

you may also have to get rid of the padding to the left and right.

I thought so, I think I'll leave it as it is

Thanks again, excellent work.

I'm sure this will help others as well.

Well there is a way to do it without effecting any other modules, but i think thats a bit over your head right now. But look, before I started buying Gavick templates I didn't know jack about PHP, Arrays, CSS, Variables.. 3 books later and 10 Gavick templates to disect, and I can do anything.

Keep On Coding!!... Honk, Honk.

Think i'm going to need to get a book or training video to get a better understanding of joomla

Thanks again for the help

lynda.com made a really good video tutorial covering the basics, and how to make your own templates... the advanced css changing video has helped me alot...

before i joined gavick as a member like your i knew jack about anything but the basic joomla.. and see now - 1000+ post and a member of the staff