Customizing Hybrid Theme in Gallery 2.3
|
radicalblues
Joined: 2007-06-05
Posts: 36 |
Posted: Mon, 2009-03-23 07:49
|
|
The title is clear enough, I want to make some changes to the Hybrid Theme in 2.3 I've been experimenting with hybrid, and I'm liking it more than matrix. But for space reasons, I'd like to make hybrid show photo info below the image (like in matrix), not at the right (like the hybrid default). It would look like this after scripting: It looking exactly the same is not necessary, it's just a quick photoshop to express my idea more clearly. Could anyone give me a hand with the scripting needed for this? Thanks to all of you for being so supportive, you're always very kind. I'm still a big newb at this kind of scripting. |
|
Posts: 27300
With such a drastic chnage on a complex theme, I would start with copying the theme so you can experiment with that new theme.
http://codex.gallery2.org/Gallery2:Themes:How_to_Copy_an_Existing_Theme
Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
Posts: 36
Oh yes, of course I created a separate theme, and even backupped all just in case. I just have no idea how to do these changes, since it's a more complex operation... I was hoping someone had experience in doing this before or if someone could be kind enough to do the scripting... I know I'm asking too much, but there's always hope. :P
Posts: 27300
in hybrid.tpl you will see a table that starts with:
<table class="itemtext"><tr><td>that table and its content needs to be moved.
place some numbers in the code and browse to the page. You will see where the numbers show up in the display and then move that table to where your number shows up.
Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
Posts: 36
Thank you Dave, such easy process made me do great progress :P
http://lnx.xradicaldreamers.net/azuland/main.php?g2_itemId=61
As you can see, I managed to get the matrix-style going in. Here's my hybrid.tpl (maybe someone else could find it useful too):
http://www.nopaste.com/p/aEE16HsHI
There's only one little details that bothers me. The images pack up all together to the left side, this is really visible if you use big screen resolutions, or widescreen. On Matrix the images stretch horizontally fitting to your screen, by giving themselves space between them. You know, just what Matrix does. Any tips on how to achieve this on my current config?
Also, silly little question... where do I change font sizes for image titles? ("High School" and such)
Posts: 27300
One way to make it centered is to:
theme.css add the bold:
#gsAlbumContent table.content { margin: 3px 0 1px 3px; margin-left: auto; margin-right: auto; }other css changes to pad between the thumbs.
@font size for title.
add or edit the css
.title { font-size: 44px; }use ff and the dev tool for css edits.
Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
Posts: 36
Thanks dave, it's easy with your insight, I think I'm getting the hold of it, being a newb at this :P
http://lnx.xradicaldreamers.net/azuland/main.php?g2_itemId=61
I edited the theme.css like this:
#gsAlbumContent td.i { text-align: center; vertical-align: top; padding: 0 10px 24px 0; }I get just the vertical padding I want, it's easy in pixels. However, the horizontal distance between items is just static (10px), I tried looking in matrix's css to see if I could find something useful, but after looking all over I found nothing... how do you make the horizontal padding matrix-style? is it using a % instead of px or something?
I hope you don't mind my insisting questions, I still plan do to a few more changes :P
Posts: 36
Sorry for double posting... but I've still got a last thing to ask, to finish customizing it the way I want...
My last request is, I want to modify the left sidebar... and move it to the top of the page instead! so the upper-left button will show/hide it at the top instead of at the left. Here is what I want it to look like: http://i39.tinypic.com/20ggzeo.jpg
Could anyone give me some hint on how to begin to do this?
Posts: 27300
That is a lot of work and without doing it myself I can't just tell you how to do it.
Good luck!
Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
Posts: 36
Allright! I've done some progress myself, and this time I wanna ask for help with a muuuuch more specific thing.
First, I've moved the left sidebar to the bottom of the page. You can check how I have it here:
http://lnx.xradicaldreamers.net/azuland/main.php?g2_itemId=2674
And now I just wanna arrange better the order of the bottom bar options. I would like it to change like this:
http://i44.tinypic.com/242byfq.jpg (showing current look up, and desired look down)
Here is my current sidebar.tpl:
http://rafb.net/p/KPQa9l12.html
I think that arranging it the way I want requires some minor table editing in sidebar.tpl, but I really lack the skills... could anyone move it close to what I want or like what I want?
I find a thin bottom bar much more better looking than the old left sidebar :X
Posts: 9
Floridave:
Looks like you are the man-in-the-know regarding mods to the Hybrid theme. I really like the theme, but I myself can't figure out how to navigate back to a parent folder that I came from when I'm on a folder view page (other than my browser's back button). I'd really like to put an up arrow maybe to the left of the slideshow button to do this. Can you (or anyone out there in galleryland) give me any pointers?