Pretty date and comments bars in sNews CMS

Pretty date and comments bars in sNews CMS

At the request of one of my readers, I will do my best to explain this little hack for sNews CMS to move the date and comments from the standard "infoline" location below the article to the top, and format them with pretty icons.

So let's get started by backing up your snews.php file and hacking on a copy.

We want the date & comments to go between the article title (if there is one) and the actual article text, so find the function articles, now locate the following code;

if ($r['displaytitle'] == 'YES') {
	if (!$_ID)  {
		echo '<h2 class="big">'.$link.$uri.'/'.$r['asef'].'/">'.$title.'</a></h2>';
	} else {
		echo '<h2>'.$title.'</h2>';
	}
}

and insert the following code below it;

if ($infoline == true) {
    echo '<div class="post_date">'.$a_date_format.'</div>';
    if ($r['commentable'] == 'YES' || $r['commentable'] == 'FREEZ') { //let's show the comments bar only if comments are enabled or frozen
        echo '<div class="post_comments">'.$link.$uri.'/'.$r['asef'].'/#'.l('comment').'1">'.l('comments').' ('.$comments_num.')</a></div>';
    }
    echo '<br class="clearer" />';                                
}

OK, that code adds the date and comment divs up top below the title and before the main article text, so now let's remove the calls from the infoline below the articles, unless you want the old style date and comments below as well. Find and following and comment out (don't delete any lines of code, we want to keep things for future reference or to return to original) as highlighted below;

switch (true) {
	case ($tag == 'date'):
		//echo $a_date_format;
		break;
	case ($tag == 'readmore' && strlen($r['text']) > $shorten):
		echo $link.$uri.'/'.$r['asef'].'/">'.l('read_more').'</a> ';
		break;
	case ($tag == 'comments' && ($commentable == 'YES' || $commentable == 'FREEZ')):
		//echo $link.$uri.'/'.$r['asef'].'/#'.l('comment').'1">
			//'.l('comments').' ('.$comments_num.')</a> ';
		break;
	case ($tag == 'edit' && _ADMIN):
		echo ' '.$edit_link;
		break;
	case ($tag != 'readmore' && $tag != 'comments' && $tag != 'edit'):
		echo $tag;
		break;
}

Now find the next switch statement below it and comment out as follows;

switch ($tag) {
	case 'date':
		//echo $a_date_format;
		break;
	case 'readmore':
	case 'comments': ;
		break;
	case 'edit':
		if (_ADMIN) {
			echo ' '.$edit_link;
		}
		break;
	default:
		echo $tag;
}

That should do it for the code in the snews.php file. Now we need to add the appropriate styles to your stylesheet so the divs don't stack on each other and look hideous. You can use whatever images you like, these are the two I use (from pinvoke)... date icon    comment icon... save them to your public_html/images folder, and then add these styles to your stylesheet;

.post_date { 
    float: left;
    width: 49%;
    color: #444;
    height: 16px;
    margin: 10px 0; 
    padding-left: 20px;
    background-image: url('../images/date.png');
    background-repeat: no-repeat;
    background-position: center left; 
}
.post_comments { 
    float: right;
    width: 49%;
    color: #444;
    height: 16px;
    margin: 10px 0; 
    padding-right: 20px;
    text-align: right;
    background-image: url('../images/comment.png');
    background-repeat: no-repeat;
    background-position: center right; 
}
.clearer {
    clear: both;
}

As always, feel free to change the styles to suit your specific needs, and don't hesitate to let me know if there's anything missing or if you get any errors.

Tags

 

You might like

Comments


Thank you!!! .. you are cool.. i'll try your steps tomorrow ~ been busy today.


It works!! ... i put it just below the 'read more' link. and i even add readmore icon .. thanks a loads.


lol, awesome man, you're welcome


thank you very much!
PP


Howdee Matt?
Just a little question: how can I add category's name before the date?


Hi Sven,

To show the category the article is in, you simply need to echo the $r['name'] variable before the date in the second line of new code, like this;

echo '<div class="post_date">'.$r['name'].' - '.$a_date_format.'</div>';

to make the category a clickable link, you,'ll want to do it like this;

echo '<div class="post_date">'.$link.$uri.'/">'.$r['name'].'</a> - '.$a_date_format.'</div>';


Me again Matt.
I put my real first name since I just noticed there was another Sven posting on your blog. How another is possible?:-D
I'm gonna try your Mod since I got some issues with another one.
Thanks for your help. I really appreciate.
1 yellow star has been delivered.


Sorry it's me again.
I've dropped the css and the sNews file to my website.

There's a slight issue:
when on the blog home page the h2 clickable title drive to the page and it becomes a non-clickable h1.

There I can't make the clickable category's name being displayed.

Where's my falut?
This is the code I use (I hope it won't screw up the post)
if ($r['displaytitle'] == 'YES') {
if (!$_ID) {
///// Byline mod
echo ''.$link.$uri.'/'.$r['asef'].'/">'.$title.'';
//echo ''.$link.$uri.'/'.$r['asef'].'/">'.$title.'';
} else {
echo ''.$title.'';

}
## Byline Mod /////////////////////
if ($infoline == true) {
echo ''.$link.$uri.'/">'.$r['name'].''.$rname.'';
echo ''.$a_date_format.'';
if ($r['commentable'] == 'YES' || $r['commentable'] == 'FREEZ') { //let's show the comments bar only if comments are enabled or frozen
echo ''.$link.$uri.'/'.$r['asef'].'/#'.l('comment').'1">'.l('comments').' ('.$comments_num.')';
}
echo '';
}

///////////////////// Byline mod ends
///////////////////////////////////


Not your fault, it's that the category name isn't being selected on all the queries, silly me, I had assumed otherwise,
you can make the following changes;

// article or page, id as indentifier
            $query_articles = 'SELECT
                    a.id AS aid,title,a.seftitle AS asef,a.category AS acat,a.keywords_meta AS keywords,text,a.date,
                    a.displaytitle,a.displayinfo,a.commentable,a.visible, c.name AS name
                FROM  '._PRE.'articles'.' AS a
                LEFT OUTER JOIN '._PRE.'categories'.' as c
                    ON category = c.id
                WHERE a.id ='.$_ID.$visible;

then on the other query,

 // get the rows for category
            if ($_catID) {
                $query_articles = 'SELECT
                        a.id AS aid,title,a.seftitle AS asef,text,a.date,a.keywords_meta AS keywords,
                        a.displaytitle,a.displayinfo,a.commentable,a.visible,c.name AS name
                FROM '._PRE.'articles'.' AS a
                LEFT OUTER JOIN '._PRE.'categories'.' as c
                    ON category = c.id
                WHERE position = 1


Found it! Sorry to be so dumb


If you're thinking of using the $_XNAME variable, that won't always work either. I just spent about 20 minutes looking into it, you definitely want to add the category name selection to the mysql queries in the articles function.


Is that last piece of code workin on your side?
On mine it displays the category articles instead of the article itself.:-D

That code is almost working:
///// Byline mod
echo ''.$link.$uri.'/'.$r['asef'].'/">'.$title.'';
//echo ''.$link.$uri.'/'.$r['asef'].'/">'.$title.'';
} else {
echo ''.$title.'';

}
## Byline Mod /////////////////////
if ($infoline == true) {
echo 'Bafouillé dans : '.$rname.''.$link.$uri.'/">'.$r['name'].'';
echo 'Bafouillé le : '.$a_date_format.'';
if ($r['commentable'] == 'YES' || $r['commentable'] == 'FREEZ') { //let's show the comments bar only if comments are enabled or frozen
echo ''.$link.$uri.'/'.$r['asef'].'/#'.l('comment').'1">'.l('comments').' ('.$comments_num.')';
}
echo '';
}

I say almost since the category link isn't displayed when on the article page.
(see: http://carnet.hiseo.fr/blog-en-vrac/la-sol...

I think it is usefull for visitors to have access to the category when reading an article. For pagination pages OMHO it has no interest to be displayed.

What's your opinion?


Hmm, this is puzzling, if you look at the source of my page, I have the div/category link in a comment right before the date.

The reason it's not working on your site is the r[name] variable isn't being set in all the mysql queries, so that code above should do it, but you're saying when you add it, it shows you the category page instead. If you look at your article page source, you'll see the link is actually there, but not the name, so we have to figure out exactly why your query isn't working right after you update the code above.

Can you use the contact form and email me the code you're using for the first two instances of $query_articles? I'll run them on my server and see if we can figure out why it's not working.


My fault!

When we join the category table we now have two "id" fields, so we need to add the alias "a" (to tell it to match the article table id) in front of the id on that first query.

I have highlighted the change in the comment above.

i.e.

WHERE id ='.$_ID.$visible;
should be
WHERE a.id ='.$_ID.$visible;


Wonderful, thanks.

Do you plan to release your Ajax search mod? Sorry if you already did and I missed it.


Hi Mark,

The ajax search autocomplete I'm using isn't really sNews specific, and it's not dynamic at this point. It's working off a hard list of keywords & phrases

I'm still a bit of a jquery/ajax newbie right now, but I'm learning and hope to get something working with sNews at some point, I want to use jquery's plug-in too so you can keydown through the list, etc

Check out the demos on this page

http://docs.jquery.com/Plugins/Autocomplete


Yet another usefull mod, gotta love your site mdj.

After adding this mod, I got curious, and wanted to add name and date to the comment,, a bit like you have:
asundrus said on Apr 25th, 2009 @ 2:45 am
blah blah

where my default sNews would just show:
blah blah
asundrus

I did search for this, but couldn't find any solution, although i'm pretty sure it's a simple mod.


Asundrus, there's a switch statement within the function comment that handles all of that output. To modify the order and layout, there's this bit of code towards the beginning of your snews.php.

// INFO LINE TAGS (readmore, comments, date)
$tags = array(
'infoline' => '<p class="date">,readmore,comments,date,edit,</p>',
'comments' => '<p class="meta">,name, '.l('on').' ,date,edit,</p>,<p class="comment">,comment,</p>'
);

the "comments" bit is the part you'll want to edit.

Hope that helps.


@asundrus if i m you i would like to add time in comment after nick name so nick name can be "sole"..Like adding BR tag to split date from nick name....That is looks better and easy to see nick name too... :)



@Matt i buy new pc laptop gatawey and big 24' screan also gatawey....I m back in bussiness but i need time to build my new site...Also im going to help Rui with his new cms ......


@Matt what MOD you use to make your style ADMIN diferent color??? Did you use 1.7 or 1.6 snews? Thx bro...


Hi Sasha, I'm using 1.7. What I do is wrap each comment in a separate div, and then when I go to start it, I check the email field from the gravatar mod, if it matches the admin email, I just assign a different class, does that make sense?
if ($email == s('website_email')) {
echo '<div class="admincomment">';
} else {
echo '<div class="comment">';
}

Maybe I'll try a write-up on it sometime if there's interest.


@Matt, thanks for the hint, and @Sasha good point, will try that.


Regarding the admin comment style, it's really nifty, but what happens if someone uses the admins name?
or is there some code or something, which could prevent this, like checking names say, you use the name admin, and visitors are not allowed to use that name, and if they try, they will get an error of some sort.


Asundrus, sort of, it's not the name, but the email field that's used to match.

What I do to prevent anyone from doing that is simply change the email address if it's not the admin, i.e

if (!_ADMIN && $email == s('website_email')) {
$email = "fakeadmin@fake.com";
}

Stick that right above the SQL INSERT statement in the function comment and if someone tries to spoof the admin email, it'll change the email to fakeadmin@fake.com.
The only problem it doesn't solve is if you change the website email, old admin comments won't show different unless you update the email as well in the DB, easy enough to do by hand really :)


Hi again.

Sorry for continuing "off-topic" but I really like this admin comment, but maybe iv'e been looking at snews.php to much today, cause all I got so far, is the part to insert before the SQL INSERT, where would I add:

if ($email == s('website_email')) {
echo '';
} else {
echo '';
}

and I guess I need a mod to make use of email, or?
i'm sorry if i'm asking stupid question, but i'm eager to learn.


Sorry for doublepost, but I guess I need the gravatar mod, for use of email?


Comments are closed. No new comments allowed.

Copyleft 2002 - 2017 Matt Jones
Hand crafted with HTML5 & CSS3
↑ Back to top