entries layout

Skinning and designing Serendipity (CSS, HTML, Smarty)
Post Reply
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

entries layout

Post by callya »

(my english suxx)

hi again!
first - thanks garvin, for all your help! ;)

my next "mission":
i want display the authorname, the time/date and the categorie of the post, directly under the article name?!

At the moment, this "infos" are standing under the entries.
(omg my english suxx²)

i tried to edit the entries.tpl, but my blog crashed! i have recoverd the old file... its not my problem.
i wanna only know, what i have to do!? :|

regards callya
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Re: entries layout

Post by garvinhicking »

You are already at the right place. Edit your entries.tpl file - and do it right this time. Your blog can only crash if you misplace wrong Smarty thingies or do not match {if} queries and whatever.

Post your crashing entries.tpl here and I'll tell you what's wrong.

Regards,
Garvin
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

Post by callya »

the completely blog was in disorder.
its not an error code or something like this.

my problem:
i dont know, what i have to copy?!

I thought, that i must copy this

Code: Select all

<p class="postmetadata{if $is_single_entry} graybox{/if}">
                <small>
                {if $is_single_entry}

				{$CONST.ENTRY_POSTED_BY} <a href="{$entry.link_author}">{$entry.author}</a> {$CONST.ON} {$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} {$CONST.AT} {$entry.timestamp|@formatTime:"%H:%M"}
                {if $entry.categories}
                   {$CONST.FILED_UNDER} {foreach from=$entry.categories item="category" name="categories"}<a href="{$category.category_link}">{$category.category_name|@escape}</a>{if not $smarty.foreach.categories.last}, {/if}{/foreach}
                {/if}
                {if $entry.allow_comments}
                    {$CONST.LEAVE_RESPONSE|sprintf:'<a href="#serendipity_CommentForm">':'</a>':"<a href=\"$entry[link]\">":'</a>'}
                    {if $entry.moderate_comments}
                        {$CONST.SUBJECT_TO_MODERATION}
                    {/if}
                {else}
                    {$CONST.COMMENTS_CLOSED}
                {/if}

                {else}
                {$CONST.POSTED_BY} <a href="{$entry.link_author}">{$entry.author}</a>
                {if $entry.categories}
                   {$CONST.IN} {foreach from=$entry.categories item="category" name="categories"}<a href="{$category.category_link}">{$category.category_name|@escape}</a>{if not $smarty.foreach.categories.last}, {/if}{/foreach}
                {/if}

                {if $dategroup.is_sticky}
                    {$CONST.ON}
                {else}
                    {$CONST.AT}
                {/if} <a href="{$entry.link}">{if $dategroup.is_sticky}{$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} {/if}{$entry.timestamp|@formatTime:'%H:%M'}</a>
.. and paste above that?!

my php-, sql-, ... , skills are very low.. :\
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Post by garvinhicking »

Well, basically there's not much PHP/SQL skill needed. Only HTML ones.

Try this entries.tpl:

Code: Select all

<!-- ENTRIES START -->
    {serendipity_hookPlugin hook="entries_header" addData="$entry_id"}

    {foreach from=$entries item="dategroup"}
        {foreach from=$dategroup.entries item="entry"}
        <div class="post">
            <h2 id="post-{$entry.id}"><a href="{$entry.link}">{$entry.title}</a></h2>
            {if !$is_single_entry}<small>{$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY}</small>{/if}

            {if $entry.categories}
            <span class="categoryIcon">
            {foreach from=$entry.categories item="category"}
                {if $category.category_icon}
                    <a href="{$category.category_link}"><img class="categoryIcon" title="{$category.category_name|@escape}{$category.category_description|@emptyPrefix}" alt="{$category.category_name|@escape}" src="{$category.category_icon}" /></a>
                {/if}
            {/foreach}
            </span>
            {/if}

            <p class="postmetadata{if $is_single_entry} graybox{/if}">
                <small>
                {if $is_single_entry}

				{$CONST.ENTRY_POSTED_BY} <a href="{$entry.link_author}">{$entry.author}</a> {$CONST.ON} {$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} {$CONST.AT} {$entry.timestamp|@formatTime:"%H:%M"}.
                {if $entry.categories}
                   {$CONST.FILED_UNDER} {foreach from=$entry.categories item="category" name="categories"}<a href="{$category.category_link}">{$category.category_name|@escape}</a>{if not $smarty.foreach.categories.last}, {/if}{/foreach}.
                {/if}
                {if $entry.allow_comments}
                    {$CONST.LEAVE_RESPONSE|sprintf:'<a href="#serendipity_CommentForm">':'</a>':"<a href=\"$entry[link]\">":'</a>'}
                    {if $entry.moderate_comments}
                        {$CONST.SUBJECT_TO_MODERATION}
                    {/if}
                {else}
                    {$CONST.COMMENTS_CLOSED}
                {/if}

                {else}
                {$CONST.POSTED_BY} <a href="{$entry.link_author}">{$entry.author}</a>
                {if $entry.categories}
                   {$CONST.IN} {foreach from=$entry.categories item="category" name="categories"}<a href="{$category.category_link}">{$category.category_name|@escape}</a>{if not $smarty.foreach.categories.last}, {/if}{/foreach}
                {/if}

                {if $dategroup.is_sticky}
                    {$CONST.ON}
                {else}
                    {$CONST.AT}
                {/if} <a href="{$entry.link}">{if $dategroup.is_sticky}{$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} {/if}{$entry.timestamp|@formatTime:'%H:%M'}</a>

                {if $entry.has_comments}
                    {if $use_popups}
                        | <a href="{$entry.link_popup_comments}" onclick="window.open(this.href, 'comments', 'width=480,height=480,scrollbars=yes'); return false;">{$entry.label_comments} ({$entry.comments})</a>
                    {else}
                        | <a href="{$entry.link}#comments">{$entry.label_comments} ({$entry.comments})</a>
                    {/if}
                {/if}

                {if $entry.has_trackbacks}
                    {if $use_popups}
                        | <a href="{$entry.link_popup_trackbacks}" onclick="window.open(this.href, 'comments', 'width=480,height=480,scrollbars=yes'); return false;">{$entry.label_trackbacks} ({$entry.trackbacks})</a>
                    {else}
                        | <a href="{$entry.link}#trackbacks">{$entry.label_trackbacks} ({$entry.trackbacks})</a>
                    {/if}
                {/if}

                {if $entry.is_entry_owner and not $is_preview}
                        | <a href="{$entry.link_edit}">{$CONST.EDIT_ENTRY}</a>
                {/if}
                {/if}
                {$entry.add_footer}
                </small>
            </p>

            <div class="entrytext">
                <p>
                {$entry.body}
                {if $is_single_entry}
                <a id="extended"></a>{$entry.extended}
                {/if}
                </p>

                {if $entry.has_extended and not $is_single_entry and not $entry.is_extended}
                <br /><a href="{$entry.link}#extended">{$CONST.VIEW_EXTENDED_ENTRY|@sprintf:$entry.title}</a><br /><br />
                {/if}

            </div>
        </div>
        <!--
        <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
                 xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
                 xmlns:dc="http://purl.org/dc/elements/1.1/">
        <rdf:Description
                 rdf:about="{$entry.link_rdf}"
                 trackback:ping="{$entry.link_trackback}"
                 dc:title="{$entry.title}"
                 dc:identifier="{$entry.rdf_ident}" />
        </rdf:RDF>
        -->
        {$entry.plugin_display_dat}

        {if $is_single_entry and not $use_popups and not $is_preview}
            {if $CONST.DATA_UNSUBSCRIBED}
                <br /><div class="serendipity_center serendipity_msg_notice">{$CONST.DATA_UNSUBSCRIBED|@sprintf:$CONST.UNSUBSCRIBE_OK}</div><br />
            {/if}

            {if $CONST.DATA_TRACKBACK_DELETED}
                <br /><div class="serendipity_center serendipity_msg_notice">{$CONST.DATA_TRACKBACK_DELETED|@sprintf:$CONST.TRACKBACK_DELETED}</div><br />
            {/if}

            {if $CONST.DATA_TRACKBACK_APPROVED}
                <br /><div class="serendipity_center serendipity_msg_notice">{$CONST.DATA_TRACKBACK_APPROVED|@sprintf:$CONST.TRACKBACK_APPROVED}</div><br />
            {/if}

            {if $CONST.DATA_COMMENT_DELETED}
                <br /><div class="serendipity_center serendipity_msg_notice">{$CONST.DATA_COMMENT_DELETED|@sprintf:$CONST.COMMENT_DELETED}</div><br />
            {/if}

            {if $CONST.DATA_COMMENT_APPROVED}
                <br /><div class="serendipity_center serendipity_msg_notice">{$CONST.DATA_COMMENT_APPROVED|@sprintf:$CONST.COMMENT_APPROVED}</div><br />
            {/if}
                <a id="trackbacks"></a><h3>{$CONST.TRACKBACKS}</h3>
                    <div class="serendipity_center">
                        <a style="font-weight: normal" href="{$entry.link_trackback}" onclick="alert('{$CONST.TRACKBACK_SPECIFIC_ON_CLICK|@escape:htmlall}'); return false;" title="{$CONST.TRACKBACK_SPECIFIC_ON_CLICK|@escape}">{$CONST.TRACKBACK_SPECIFIC}</a>
                    </div>
                    <ol class="commentlist">
                        {serendipity_printTrackbacks entry=$entry.id}
                    </ol>
        {/if}

        {if $is_single_entry and not $is_preview}
                <a id="comments"></a><h3>{$CONST.COMMENTS}</h3>
                <div class="serendipity_center">{$CONST.DISPLAY_COMMENTS_AS}
                {if $entry.viewmode eq $CONST.VIEWMODE_LINEAR}
                    ({$CONST.COMMENTS_VIEWMODE_LINEAR} | <a href="{$entry.link_viewmode_threaded}#comments">{$CONST.COMMENTS_VIEWMODE_THREADED}</a>)
                {else}
                    (<a href="{$entry.link_viewmode_linear}#comments">{$CONST.COMMENTS_VIEWMODE_LINEAR}</a> | {$CONST.COMMENTS_VIEWMODE_THREADED})
                {/if}
                </div>
                <br />
                <ol class="commentlist">
                    {serendipity_printComments entry=$entry.id mode=$entry.viewmode}
                </ol>

                {if $entry.is_entry_owner}
                    {if $entry.allow_comments}
                    <div class="serendipity_center">(<a href="{$entry.link_deny_comments}">{$CONST.COMMENTS_DISABLE}</a>)</div>
                    {else}
                    <div class="serendipity_center">(<a href="{$entry.link_allow_comments}">{$CONST.COMMENTS_ENABLE}</a>)</div>
                    {/if}
                {/if}
                <a id="feedback"></a>

                {foreach from=$comments_messagestack item="message"}
                <div class="serendipity_center serendipity_msg_important">{$message}</div>
                {/foreach}

                {if $is_comment_added}

                <br />
                <div class="serendipity_center serendipity_msg_notice">{$CONST.COMMENT_ADDED}</div>

                {elseif $is_comment_moderate}

                <br />
                <div class="serendipity_center serendipity_msg_notice">{$CONST.COMMENT_ADDED}<br />{$CONST.THIS_COMMENT_NEEDS_REVIEW}</div>

                {else}

                <br />
                <h3>{$CONST.ADD_COMMENT}</h3>
                {$COMMENTFORM}

                {/if}
        {/if}

        {$entry.backend_preview}
        {/foreach}
    {foreachelse}
    {if not $plugin_clean_page}
        {$CONST.NO_ENTRIES_TO_PRINT}
    {/if}
    {/foreach}

    <div class="navigation" style="text-align: center">
    {if $footer_prev_page}
        <a href="{$footer_prev_page}">« {$CONST.PREVIOUS_PAGE}</a>  
    {/if}

    {if $footer_info}
        ({$footer_info})
    {/if}

    {if $footer_next_page}
        <a href="{$footer_next_page}">» {$CONST.NEXT_PAGE}</a>
    {/if}

    {serendipity_hookPlugin hook="entries_footer"}
    </div>
<!-- ENTRIES END -->
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

Post by callya »

mh, thanks.
ok, its above the entrie!
but, that is not what i mean. :P

Under the article name, there should be standing: "date/time", "authorname", "time of post" and the "categorie"

like:

ARTICLE NAME
posted by xxx at xx:xx in "categorie"

(here the full entrie)

Comments | Trackbacks
(and the karma)

do you understand?!
I'm complicated, i know! ;)
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Post by garvinhicking »

BTW: You should also modify this:

Code: Select all

            <div class="entrytext">
                <p>
                {$entry.body}
                {if $is_single_entry}
                <a id="extended"></a>{$entry.extended}
                {/if}
                </p>

                {if $entry.has_extended and not $is_single_entry and not $entry.is_extended}
                <br /><a href="{$entry.link}#extended">{$CONST.VIEW_EXTENDED_ENTRY|@sprintf:$entry.title}</a><br /><br />
                {/if}

            </div>

to this:

Code: Select all

            <div class="entrytext">
                <p>
                {$entry.body}
                {if $is_single_entry}
                <a id="extended"></a>{$entry.extended}
                {/if}
                </p>

                {if $entry.has_extended and not $is_single_entry and not $entry.is_extended}
                <br /><a href="{$entry.link}#extended">{$CONST.VIEW_EXTENDED_ENTRY|@sprintf:$entry.title}</a><br /><br />
                {/if}
<br style="clear: both" />
            </div>
Notice the '<br style="clear: both" />' tag. That will take care that your images will not overlap the entry area.

BTW, funny blog. Just put it into my RSS Bandit :-)

Regards,
Garvin
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

Post by callya »

gna, die frage bekomm ich nicht auf ennglisch gebacken! ;)
also:

das ist ja nun dadrüber, aber wie gesagt, alles in einem stück.
kann man die einzelnen teile (name, categorie, ... ) auch "teilen"?

also das die "kommentare" und "trackbacks" unter dem post stehen bleiben und die andern infos direkt nach "DATE_FORMAT_ENTRY" kommen?!

hach, ich könnte den ganzen tag an meim blog rumbasteln, wenn ich es denn könnte! ;)
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Post by garvinhicking »

Hm, sorry - die Wünsche gehen mir etwas zu weit, da solltest du am besten selber mal nachgucken. Das ist echt nicht kompliziert

Schau Dir mal die entries.tpl an. Beispielsweise folgender block:

Code: Select all

				{$CONST.ENTRY_POSTED_BY} <a href="{$entry.link_author}">{$entry.author}</a> {$CONST.ON} {$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} {$CONST.AT} {$entry.timestamp|@formatTime:"%H:%M"}.
Alles was mit {$...} anfängt ist eine Variable die ausgegeben wird. Alles was mit {$CONST....} anfängt ist immer ein Satz. Sowas wie "Posted by...". Wie Du siehst wir ddann der Author name angegeben.

Wenn das obere dann geparst wird würde z.B. folgendes rauskommen:

Code: Select all

Eintrag erstellt von <a href="http://blog/author/garvin">Garvin</a> am 12.03.2005 um 14:44.
Wenn ich das jetzt umstellen wollte in:

Code: Select all

Am 12.03.2005 wurde um 14:44 dieser Eintrag von Garvin erstellt.
dann würde ich folgenden Template Code benutzen:

Code: Select all

Am {$entry.timestamp|@formatTime:DATE_FORMAT_ENTRY} wurde um {$entry.timestamp|@formatTime:"%H:%M"} dieser Eintrag von {$entry.author} erstellt.
Übrigens ist das was das Karmaplugin ausgibt in {$entry.add_footer} enthalten. Das kannst Du also wieder ans Ende schieben wenn Du willst. Und immer brav ein <p> oder <div> drumsetzen damit Du per CSS die Styles verändern kannst und es gültiger HTML-Code wird.

Total einfach also. Musst nur die Brocken jeweils dahin verschieben wo sie stehen sollen. Und immer darauf achten dass Du foreach/if/Blöcke usw. nicht auseinanderbrichst.

Mehr zu der Templatesprache und was modifier sind und so unter http://smarty.php.net/

Also viel Spaß damit. Etwas Eigeninitiative ist schon gefordert wenn Du solche Sonderwünsche hast. :-)

Grüße,
Garvin
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

Post by callya »

Ich würde niemals von jemanden verlangen, dass er mir irgendetwas fertig vor die füsse wirft! ;)
Ich weiß, wie es ist, wenn dauertn leute ankommen und fragen, ob man das nicht mal schnell scripten kann oder so.

Von der logik ist das auch nicht schwer, bloß ich erkenne immer nicht, wo ein blcok anfägt und wieder aufhört.
Ist es das erste "/if" oder das zweite..

naja, danke trotzdem! :)
Schönes Wochenende noch!

gruß
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Post by garvinhicking »

Callya, sorry, da habe ich mich missverständlich ausgedrückt. Ich ging nicht davon aus, dass Du so etwas erwartest - eher habe ich von mir aus selber versucht Dir eine Fertiglösung zu bieten. Aber leider wurde das dann doch zu komplex - ich wollte hier also nicht rummaulen dass Du so etwas verlangen würdest. :-)

Es gibt einige Syntax-Highlighting Editor für Smarty-Templates; UltraEdit z.B. zeigt farbig solche {if}s und sw. mit an. Ansonsten sind die meisten Ifs u.ä. auch eingerückt, dass man es halbwegs einfach abzählen kann. Ansonsten auch einfach vom /if ausgehend zurück zum nächsten {if} gehen, das ist dann der Anfang des Blocks :)

Ich hoffe dass Du irgendwie zurecht kommst - mit etwas Experimentieren sollte das ja vielleicht irgendwie gehen. Viel kaputt machen kann man ja nicht solange man die Originaldatei noch hat. ;)

Viel Erfolg also! :-)

Grüße,
Garvin
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
callya
Regular
Posts: 122
Joined: Sat Apr 02, 2005 8:42 pm
Location: Hamburg / Germany
Contact:

Post by callya »

Wollte es auch nur widerlegen. ;)
Es gibt Leute, die regen sich über leute wie mich (anfänger) auf und sind genervt, wenn man sie was fragt, weil sie denken, dass man das von den fertig programmiert zurück bekommt.

(welch komplexer satz) :D

Wie dem nu auch sei.
Danke, auch wenn ich 'noch' ein Fragezeichen über dem Kopf hängen habe. :)

Werd mich mal in die materie reinfuchsen. :)

lg
seraphenemies

Post by seraphenemies »

Hi, I wanted to do the same thing, have the entry title and underneath have the author, date and time and then the entry beneath that. I used the code on this page, and it works, but its a bit messed up (see here http://www.adeptsin.com/blog ). Can you help me fix this?

Thanks :)
seraphenemies

Post by seraphenemies »

I forgot to say that I also wanted the comments and tracksbacks at the bottom of the entry, while the code given on this page displays it underneath the entry. Is there a way to change this?
garvinhicking
Core Developer
Posts: 30022
Joined: Tue Sep 16, 2003 9:45 pm
Location: Cologne, Germany
Contact:

Post by garvinhicking »

Please read http://www.s9y.org/44.html and then check out the Smarty templating tutorials on http://smarty.php.net/ - the entries.tpl can be edited easily, I sadly don't have time to create and modify templates right now.

It's really easy, you can achieve manythings by just trying out to rearrange code.

Regards,
Garvin
# Garvin Hicking (s9y Developer)
# Did I help you? Consider making me happy: http://wishes.garv.in/
# or use my PayPal account "paypal {at} supergarv (dot) de"
# My "other" hobby: http://flickr.garv.in/
Post Reply