add special links under the search bar

@ auswellbeing,

You can add those links to a static block, then insert the block to that place. Assume that you have a static block with id specialllinks so you can insert as follows:

Open the app\design\frontend\default\jm_megamalltemplate\p age\html\header.phtml file, then you would see the line of code block:

PHP Code:

  <?php echo $this->getChildHtml('topSearch') ?>


Right below it, you add:

PHP Code:

  <?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('specialllinks')->toHtml() ?>


Some additional css rules are needed to have the links displayed beautifully.

Thank you very much Sherlock Holmes .

It is perfect for layouts web, tablet and mobile-portrait
But on the mobile, it places under the search bar and it show a problem( may be index level(?) not sure..)

It will be great the static block can move to other place as a second pic.

help me~

thank you.

hyeonjoo

Attachment 33711Attachment 33712

You can open the skin/frontend/default/jm_megamall/css/layout-mobile.css file and add this new rule:

HTML Code:

 .speciallinks {
        position: relative;
        top: -81px;
      }

Hope this helps.

You can open the skin/frontend/default/jm_megamall/css/layout-mobile.css file and add this new rule:

HTML Code:

 .speciallinks {
        position: relative;
        top: -81px;
      }

Thanks. ^^

Added in a css layout-mobile.css then got this.

Attachment 33820

It’s fine now 360px and disappeared at 560px

I thought that "wide 560px " could use a layout-mobile portrait.css
But It actually affected by layout-mobil.css.

Just in case,
I added

.speciallinks {
position: relative;
}

In a layout-mobile portrait.css.

It wasn’t changed.

Hyeonjoo

http://www.aus-wellbeing.com.au

you can remove that rule in the layout-mobile.css file and add it to the layout-mobile-portrait.css file.

many thanks!!