Piwigo.org

You are not logged in. (Register / Login)

Announcement

#1 2011-12-02 21:29:58

alx_photo
Member
Location: Germany, Europe
Registered: 2011-12-02
Posts: 5

[resolved] Horizontal Menu on Page Head/Banner

Hello everyone,

I just came across Piwigo a couple of days ago and really seem to like it.

However, upon setting up my first gallery I do experience some problems in customization. Currently I try to set up a static horizontal menu of links in the top right corner. I tried to do this in the page banner as follows (not nicely done):

Theme: stripped
Code in page banner:

Code:

<div style="float:right;padding-left:7px;vertical-align:top;font-weight:bold; letter-spacing:2px">
<a href="index.php?/categories">Albums</a>
⚫
<a href="about.php?">The Photographer</a>
⚫
<a href="index.php?/contact">Contact</a>
</div>

This works well on my home/intro page with no albums. But on the other pages where you have the Menu/Home/... Path-line, this line is squeezed underneath, forcing additional empty space underneath my menu in the top right corner.

Is there any way to get the two in the same line, so that there will be no extra vertical spacing?

Offline

#2 2011-12-02 21:45:20

alx_photo
Member
Location: Germany, Europe
Registered: 2011-12-02
Posts: 5

Re: [resolved] Horizontal Menu on Page Head/Banner

oh, I forgot, here is the example as it looks on the homepage:

http://prelaunch.silentcaptures.com/

and here on the categories page:
http://prelaunch.silentcaptures.com/ind … categories

If you switch between the two, you can see how the spacing to the underlying main block changes.

Cheers,
Alex

Offline

#3 2011-12-03 11:31:05

plg
Piwigo Team
Location: Paris, France, Europe
Registered: 2002-04-05
Posts: 12367
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

Your banner (and photos) is nice.

If I understand correctly, on page http://prelaunch.silentcaptures.com/ind … categories you want "Menu » Home / Albums" and "Albums ⚫ The Photographer ⚫ Contact" to be on the same line, right?

Offline

#4 2011-12-03 16:36:46

flop25
Piwigo Team
Registered: 2006-07-06
Posts: 5507
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

Hello
padding-top: 10px;
for your div
works on firefox


To get a better help : Politeness like Hello-A link-Your past actions precisely described
Check my extensions : more than 30 available
who I am and what I do : http://fr.gravatar.com/flop25
My gallery : an illustration of how to integrate Piwigo in your website

Offline

#5 2011-12-03 22:35:08

alx_photo
Member
Location: Germany, Europe
Registered: 2011-12-02
Posts: 5

Re: [resolved] Horizontal Menu on Page Head/Banner

Again, I have to apologize to ask such beginners questions, but my last attempts at web-design were 6 years ago.

plg wrote:

Your banner (and photos) is nice.

If I understand correctly, on page http://prelaunch.silentcaptures.com/ind … categories you want "Menu » Home / Albums" and "Albums ⚫ The Photographer ⚫ Contact" to be on the same line, right?

Thank you for the quick reply. This is exactly what I want!
(BTW, the photos are just a sample set of some old scanned slides, there will be more and better to come of course :-) )

flop25 wrote:

Hello
padding-top: 10px;
for your div
works on firefox

Thanks! Yes, this sort of works as a workaround. I will play a bit with paddings now to make it look the same on all pages and some different browsers.

Is there any more elegant way, which does not break when I select different themes? Not that I really need different themes right now, but it would be great to build everything consistently.


Anyway, I am sure I will come up with more questions on the course of building my gallery :)

Offline

#6 2011-12-03 22:39:55

plg
Piwigo Team
Location: Paris, France, Europe
Registered: 2002-04-05
Posts: 12367
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

flop25 wrote:

Hello
padding-top: 10px;
for your div
works on firefox

Nice solution. Also works fine on Chrome.

Offline

#7 2011-12-03 22:44:18

plg
Piwigo Team
Location: Paris, France, Europe
Registered: 2002-04-05
Posts: 12367
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

alx_photo wrote:

Is there any more elegant way, which does not break when I select different themes? Not that I really need different themes right now, but it would be great to build everything consistently.

Yes, you can do something slightly better. Instead of having CSS rules in the HTML banner, activate the LocalFiles Editor plugin and edit the CSS for theme Stripped :

Code:

#headerLinks {
  float:right;
  padding-left:7px;
  vertical-align:top;
  font-weight:bold;
  letter-spacing:2px;
  padding-top:10px;
}

and you Page Banner, just have :

Code:

<div id="headerLinks">
<a href="index.php?/categories">Albums</a>
⚫
<a href="about.php?">The Photographer</a>
⚫
<a href="index.php?/contact">Contact</a>
</div>

alx_photo wrote:

Anyway, I am sure I will come up with more questions on the course of building my gallery :)

You're welcome. Open one new topic for each question and mark this one as "resolved" when you're fine with the provided solution :-)

Offline

#8 2011-12-04 01:52:38

alx_photo
Member
Location: Germany, Europe
Registered: 2011-12-02
Posts: 5

Re: [resolved] Horizontal Menu on Page Head/Banner

Thanks again!

I edited local/css/stripped-rules.css as you said, and it worked like a charm.
Actually I did add
padding-bottom:3px;
which helps to maintain the same vertical spacing on the starting (home)page, as on the albums pages.

Offline

#9 2011-12-07 13:59:48

plg
Piwigo Team
Location: Paris, France, Europe
Registered: 2002-04-05
Posts: 12367
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

I've jsut refreshed your gallery and... wow, I really like it, very modern, a nice example of use for Piwigo. Congratulations!

Offline

#10 2011-12-07 14:37:43

alx_photo
Member
Location: Germany, Europe
Registered: 2011-12-02
Posts: 5

Re: [resolved] Horizontal Menu on Page Head/Banner

plg wrote:

I've jsut refreshed your gallery and... wow, I really like it, very modern, a nice example of use for Piwigo. Congratulations!

Thank you! Once it has grown a bit, I will register it as a showcase.

And yes, after  http://www.photoscapes.eu/egypt06 (homemade PHP gallery), I needed something clean and modern, with the images being in the centre of attention ;)

Cheers,
Alex

Offline

#11 2011-12-07 14:43:29

plg
Piwigo Team
Location: Paris, France, Europe
Registered: 2002-04-05
Posts: 12367
Website

Re: [resolved] Horizontal Menu on Page Head/Banner

Your previous gallery was already quite good for an "home made" website.

Offline

Board footer

Powered by FluxBB

twitter facebook google+ newsletter Donate Piwigo.org © 2002-2014 · Contact