Piwigo.org

alx_photo · 2011-12-02 21:29:58

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?

alx_photo · 2011-12-02 21:45:20

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

plg · 2011-12-03 11:31:05

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?

flop25 · 2011-12-03 16:36:46

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

alx_photo · 2011-12-03 22:35:08

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 :)

plg · 2011-12-03 22:39:55

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

Nice solution. Also works fine on Chrome.

plg · 2011-12-03 22:44:18

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 :-)

alx_photo · 2011-12-04 01:52:38

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.

plg · 2011-12-07 13:59:48

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

alx_photo · 2011-12-07 14:37:43

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

plg · 2011-12-07 14:43:29

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

Piwigo.org

Announcement

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

[resolved] Horizontal Menu on Page Head/Banner

Code:

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

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

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

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

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

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

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

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

plg wrote:

flop25 wrote:

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

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

flop25 wrote:

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

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

alx_photo wrote:

Code:

Code:

alx_photo wrote:

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

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

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

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

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

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

plg wrote:

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

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

Board footer