Archived

This topic is now archived and is closed to further replies.

  • 0

Any Idea On How To Do This?

Question

Posted · Report post

The attached file shows how my site should look like. I'm almos there, but I still have some questions.

 
My site can be found here: http://www.cursoer.com/site/
 
As you can see I need to put those flags right between the nav and the highlights section. Each flag is a link to a different site.
 
Secondly, I need to reduce the space between the blog content and the morefoot section.
 
Last, but not least, it would be cool if I could put the logo on the same line as the nav, where the logo would be left aligned and the menu right aligned.

 

How can I do it?

 

Thanks!

Share this post


Link to post
Share on other sites

2 answers to this question

Posted · Report post

Hi there,

 

I would advise you to check out the hooker plugin, which will allow you to insert some html into one of the hooks in the header so that the flags and the links go into the correct area. You can find out more about hooker here http://www.pagelines.com/store/plugins/hooker/ and a list of the pagelines hooks - http://api.pagelines.com/hooks

 

Both the alignment of the logo and the reduction of the padding between the sections can be done with css. If you've not used css before please check out http://www.pagelines.com/wiki/Custom_CSS for an overview. You'll need either Firebug or chrome dev tools for editing the css which you can paste back into Pagelines>site options>custom code.

 

Hope this helps

Share this post


Link to post
Share on other sites

Posted · Report post

James is, as always, correct about Hooker.

 

If you check this particular post, you'll see an example of the way to place the flags to the right side of the branding image:

http://www.pagelines.com/forum/topic/24070-banner-ad-plugin-in-header-of-my-page/?hl=leaderboard#entry140760

 

You can also apply the images into that same hook with CSS associated with each flag.  You'd make a URL, associate it with a unique class, then using CSS, apply the flag (semi-transparent) as a background, and full color image when on hover or active.   This can also be achieved with image opacity, but some browsers still don't work with it:  http://www.w3schools.com/css/css_image_transparency.asp

 

Sprites would work as well as in the example provided here:

http://www.w3schools.com/css/css_image_sprites.asp

Share this post


Link to post
Share on other sites