| Author |
Message |
scottdallas
Joined: 04 May 2006
Posts: 1843
Location: US |
|
 Finally mastered galleries! |
 |
I'm so happy.. I remember reading that post on cutephp about making galleries and things with cutenews but it never made sense. I'm so happy you rewrote that FI-DD cause I went slowly through it yesterday and had it figured out in 5 minutes. Makes PERFECT sense now. I can see it all in my head now. I really appreciate it, that's going to really help out in a lot of ways.
So, here's what I did..
http://www.scodal.com/photoblog.php <-- that page has it
I did 50% width for 2 side by side instead of # # # #
And same with
http://scodal.com/entertainment.php
But I can see how that works now.. 25% for 4 and make sure your images aren't too wide or they'll overlap and some crazy stuff.
I've been wanting to get that up and running for so long but I felt it had to be just right considering that's my baby. Also, see how that image rotates at the top of the screen? I know no one likes the idea of multiple cutenews installations but that's just an iframe pointing to a file that includes Cutenews 1.3.6 with the random hack from FI-DD and every page load it goes to that database and pulls from $category = "1"; a new image from the 51 I put in there. Plus I love that I can add to it anytime I feel like it.
The template is actually real simple:
<a href="{full-story}" target="_blank"><img src="{short-story}"></a>
I don't even use the {title} in the templates, I use that as my description of what image I put so when I go to 'Edit' news I can tell which post is what but no one else ever sees it. Just an orginzational method for me. Simple stuff but I think it's awesome.
So yeah.. I wanted to showcase:
http://www.scodal.com
_________________
www.scottdizzle.com uses cnr 
last update: 07-22-08: 8:30 pm |
|
| Fri Oct 06, 2006 2:45 am |
    |
 |
Guest
|
| |
|
Please login to hide the ads.
|
|
|
|
|
ksen
Joined: 04 Jun 2006
Posts: 142
|
|
| |
|
thats odd!! i dont seem to b abl to see ur site in the gallery manner #### !! Either of the sites!! Both on my machine are seen one below the other. Anyways here is the template and the CSS that i used to biuld mine. Ofcourse i did it after reading fi-dd's post..
I have shown my photos 3 in a row. Its set in the CSS.
###
###
###
Short story template
 | |
<div class="GalleryShort" >
<table border="0" cellpadding="3">
<tr>
<td align="center">{short-story}</td>
</tr>
<tr>
<td align="center">[full-link]<a href="galleryfull.php?id={id}">{title}</a>[/full-link]</td>
</tr>
</table>
</div>
|
Full story template
| |
<div style="width:100%; margin-bottom:10px;">
<div class="NewsTitle" ><strong>{title}</strong>
[if-logged]<small style="font-size: 10px;"> (<a href="{cutepath}/index.php?mod=editnews&id={id}" target="_blank" title=Edit news">Edit</a> / <a href="{cutepath}/index.php?mod=editnews&action=delete&selected_news[]={id}" target="_blank" title="Delete news">Delete</a>)</small>[/if-logged]
</div>
<div class="NewsContent" style="padding:3px; margin-top:3px; border-top:1px solid #D3D3D3;">{date}</div>
<div class="NewsContent" style="text-align:justify; padding:3px; margin-top:3px; margin-bottom:5px;">
<p>{full-story}</p>
<p><img src="images/icon-print.gif" alt="Print" width="18" height="16" border="0" /> <a href="{link=print/post}" target="_blank"><b>Print</b></a>
<img src="images/icon-tellfriend.gif" alt="Print" width="18" height="16" border="0" /> <a onclick= "window.open('{cutepath}/mail_to_friend.php?url={link=home/post}','','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,copyhistory=no,resizable=no,width=370,height=285')" href="javascript:void(0);" title="Tell_a_Friend."><b>E-Mail Article</b></a></p>
</div>
|
And my CSS
| | .GalleryShort {
float: left;
width: 30%;
height: 200px;
margin: 0 6px 6px 0;
overflow:hidden;
}
.Container{
width:100%;
} |
|
|
| Fri Oct 06, 2006 1:20 pm |
|
|
scottdallas
Joined: 04 May 2006
Posts: 1843
Location: US |
|
| |
|
Do you see it in:
# #
# #
# #
# #
???
I only intended to have 50% width and 2 items next to each other because I only have about 500 pixels width to work with. I like what you did with your code though! So when you go to scodal.com are there errors or do things load incorrectly? Woah, you're right it sure doesn't work on IE ;( It looks fantastic on FireFox for me though.
Can I see your site where you have that code in place?
Also, here is my code (which makes me look like a wimp after comparing) are there flaws in my code?
CSS Code:
 | | <style>
.left {
float: left;
width: 50%;
height: 200;
}
</style> |
Include Code:
| | <div class="container">
<?php
$number = "30";
$category = "4";
$template = "2-gallery";
include("admin/show_news.php");
?>
</div> |
2-gallery template code:
| | <div class="left"><table border="0" cellpadding="3" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1">
<tr>
<td width="100%">
<font face="Tahoma" style="font-size: 9pt; font-weight: 700">
<a target="[xfvalue_target]" href="[xfvalue_fullstoryurl]">{title}</a></font></td>
</tr>
<tr>
<td width="100%">
<div align="center"><a href="[xfvalue_fullstoryurl]" target="[xfvalue_target]">{avatar}</a></div></td>
</tr>
<tr>
<td width="100%">
<p align="center"><font face="Tahoma" style="font-size: 9pt">
<a href="{link=home/post}">{rating}</a></font></td>
</tr>
<tr>
<td width="100%"><font face="Tahoma" style="font-size: 8pt" color="#333333"> -
{short-story}</font></td>
</tr>
<tr>
<td width="100%"><font face="Tahoma" style="font-size: 8pt" color="#FFFFFF">
...</font></td>
</tr>
</table></div> |
Result:
http://www.scodal.com/photoblog.php
_________________
www.scottdizzle.com uses cnr
last update: 07-22-08: 8:30 pm |
|
| Fri Oct 06, 2006 11:54 pm |
|
|
scottdallas
Joined: 04 May 2006
Posts: 1843
Location: US |
|
| |
|
Wow!.. I really like this:
| | <td align="center">[full-link]<a href="galleryfull.php?id={id}">{title}</a>[/full-link]</td> |
Brilliant idea...
_________________
www.scottdizzle.com uses cnr
last update: 07-22-08: 8:30 pm |
|
| Sat Oct 07, 2006 12:31 am |
|
|
ksen
Joined: 04 Jun 2006
Posts: 142
|
|
| |
|
 ur welcome
Anyways ur rite, it does show perfectly in firefox but not in IE!!
Couple of things u may wana do. --> both in ur CSS file.
| | <style>
.left {
float: left;
width: 50%;
height: 200;
}
</style> |
Try changing this to -->
| | <style>
.left {
float: left;
width: 45%;
height: 200;
overflow: hidden;
}
</style> |
If it still doesnt work on IE try reducing the width some more or if its already showing u may wana increase it gradually till u hit the optimum value.
|
|
| Sat Oct 07, 2006 4:43 am |
|
|
Ramon
Joined: 12 Oct 2005
Posts: 462
Location: Hoogeveen, NL |
|
| |
|
I think this is the known bug in IE called Border-Box model or something.. Al you have to do is add an "display: inline;" to your classes. Then it should work fine
_________________
 |
|
| Sat Oct 07, 2006 1:18 pm |
|
|
scottdallas
Joined: 04 May 2006
Posts: 1843
Location: US |
|
| |
|
Well I tried all 3 suggestions and it was in fact just the width. As soon as I put 49% or less it was immediately fixed in IE but now I have a new problem! IE Is cool, looks great but FireFox uses that 1% that's left over on the right side to slap in the pagination. It looks retarded lol. 45% makes it worse. I almost have to have 50%.. is there some way to force it to show up underneath? If I put the pagination code in tables it seems to break up worse.
Update:
Actually, this seems to fix that but I don't even understand why.. It shouldn't.. I have no table specified lol, the table would throw all pagination on the top right of the screen not even inside the website at all, so bye bye <table></table>:
Template code for pagination:
| | <tr>
<td width="100%"><p align="center"><font face="Tahoma" style="font-size: 9pt">[prev-link]<< Previous[/prev-link] {pages} [next-link]Next >>[/next-link]</font></td>
</tr>
<br> <tr>
<td width="100%">
<p align="right"><font face="Tahoma" style="font-size: 9pt">You are viewing
page <b>{current-page}</b> of <b>{total-pages}</b>.</font></td>
</tr> |
Now IE and firefox are happy.. and boy does that make me happy. Savages.
_________________
www.scottdizzle.com uses cnr
last update: 07-22-08: 8:30 pm |
|
| Sat Oct 07, 2006 6:16 pm |
|
|
|
