Page 1 of 4

News template

Posted: Mon 2. Jun 2008, 17:03
by 360fusion
I have been playing around with the news template. I have created a news listing and added some CSS if anyone would like to use it.

I have added a border to the image with CSS and made the image a link to the article
I have made the article title a link
I have removed the main article title
added the live date to the article detail with 'created on' and added 'by' as in 'written by' to the template to show the authors name (ideally should have added it to the php file) so it will show as: Written on 31-05-2008 by Ben, Middlesbrough
I've also added a horizontal line to separate the teaser listing
It has not been tested in IE6

Save this template code as a .tmpl file in template\inc_cntpart\news\

Code: Select all

<!--NEWS_SETTINGS_START//-->
; how many news should be listed per row
news_per_row = 2

; teaser text rendered as <p></p> = p
; or just line break to <br> = br
news_teaser_text = p

; template for files - the same as used
; for content part files , default:
; files_template_list = default
files_template_list = default
files_template_detail = default
files_direct_download = 0

<!--NEWS_SETTINGS_END//-->
news_per_row = 1

<!--NEWS_LIST_START//-->
[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
	<div class="hrNews"></div>
[NEWS_ENTRIES]{NEWS_ENTRIES}[/NEWS_ENTRIES]
<!--NEWS_LIST_END//-->

<!--NEWS_LIST_ENTRY_START//-->
	<!-- 
		Changedate: {DATE:d/m/Y H:i:s lang=EN}
		Livedate: {LIVEDATE:d.m.Y H:i:s lang=EN}
		Killdate: {KILLDATE:d.m.Y H:i:s lang=EN}
	//-->
	<div class="newsEntry[PRIO] prio{PRIO}[/PRIO]">
	[IMAGE]<a href="{NEWS_DETAIL_LINK}"><div class="newsImageTeaser"><img src="img/cmsimage.php/120x120x1/{IMAGE_ID}" alt="{CAPTION}" border="0" /></div></a>[/IMAGE]
	[NEWS_TITLE]<h2><a href="{NEWS_DETAIL_LINK}">{NEWS_TITLE}</a></h2>[/NEWS_TITLE]
	[NEWS_TEASER]<div class="news_teaser">{NEWS_TEASER}</div>[/NEWS_TEASER]
	[NEWS_TEASER_ELSE][NEWS_TEXT]{NEWS_TEXT}[/NEWS_TEXT][/NEWS_TEASER_ELSE]
	[NEWS_DETAIL_LINK]<div class="link"><a href="{NEWS_DETAIL_LINK}">Read more...</a></div>[/NEWS_DETAIL_LINK]
	<div class="hrNews"></div>
	</div>
<!--NEWS_LIST_ENTRY_END//-->

<!--NEWS_LIST_ENTRY_SPACE_START//-->
	<!-- space between news items -->
<!--NEWS_LIST_ENTRY_SPACE_END//-->

<!--NEWS_LIST_ROW_SPACE_START//-->
	<!-- space between rows of news items -->
<!--NEWS_LIST_ROW_SPACE_END//-->


<!--NEWS_LIST_START//-->
[NEWS_ENTRIES]{NEWS_ENTRIES}[/NEWS_ENTRIES]
<!--NEWS_LIST_END//-->


<!--NEWS_DETAIL_START//-->
<div class="news">
	<!-- 
		Changedate: {DATE:d/m/Y H:i:s lang=EN}
		Livedate: {LIVEDATE:d.m.Y H:i:s lang=EN}
		Killdate: {KILLDATE:d.m.Y H:i:s lang=EN}
	//-->
	[NEWS_TITLE]<h1>{NEWS_TITLE}</h1>[/NEWS_TITLE]
	[NEWS_SUBTITLE]<h2>{NEWS_SUBTITLE}</h2>[/NEWS_SUBTITLE]
	[NEWS_TOPIC]<p>Written on {LIVEDATE:d-m-Y lang=EN} by [AUTHOR]{AUTHOR}[PLACE], {PLACE}[/PLACE][/AUTHOR][AUTHOR_ELSE][PLACE], {PLACE}[/PLACE][/AUTHOR_ELSE]</p>[/NEWS_TOPIC]
	[IMAGE]
		[ZOOM_ELSE]
	[IMAGE_URL]<a href="{IMAGE_URL}"{IMAGE_URL_TARGET}>[/IMAGE_URL]
	<div class="newsImageTeaser"><img src="img/cmsimage.php/150x150x1/{IMAGE_ID}" alt="{CAPTION}" border="0" /></div>[IMAGE_URL]</a>[/IMAGE_URL]
		[/ZOOM_ELSE]
		[ZOOM]
	<a href="img/cmsimage.php/640x480/{IMAGE_ID}" target="_blank"{LIGHTBOX}[LIGHTBOX_CAPTION] title="{LIGHTBOX_CAPTION}"[/LIGHTBOX_CAPTION]>
	<div class="newsImageTeaser"><img src="img/cmsimage.php/200x185x1/{IMAGE_ID}" alt="{CAPTION}" border="0" /></div></a>
		[/ZOOM]		
	[/IMAGE]
	[NEWS_TEXT]<div class="news_text">{NEWS_TEXT}</div>[/NEWS_TEXT]
	[NEWS_TEXT_ELSE][NEWS_TEASER]{NEWS_TEASER}[/NEWS_TEASER][/NEWS_TEXT_ELSE]
	[URL]
		<p><a href="{URL}"{URL_TARGET}>[URL_TEXT]{URL_TEXT}[/URL_TEXT][URL_TEXT_ELSE]more[/URL_TEXT_ELSE]</a></p>
	[/URL]
	[FILES]{FILES}[/FILES]
		[NEWS_LIST_LINK]
		<p class="link"><a href="{NEWS_LIST_LINK}">Back to news section</a></p>
	[/NEWS_LIST_LINK]
</div>
<!--NEWS_DETAIL_END//-->
Add this CSS to the frontend.css

Code: Select all

/* ------- start news --------- */

.newsEntry {
   padding: 5px 0 0px 0;
}

.newsImageTeaser {
   float:left; 
   border: 5px solid #f6ecee; 
   margin: 0px 10px 5px 0;
   padding: 0px 0px 0 0;

}
.newsImageDetail {
   float:left; 
   border: 5px solid #f6ecee; 
   margin: 4px 10px 5px 0;
   padding: 0px 0px 0 0;

}
.news_teaser {
	text-align: justify;
}

.news_text{
	text-align: justify;
}
.hrNews{
   margin: 0px 0 0px 0;
   padding: 5px 0 0px 0;
   height:0;
   border:0;
   border-bottom:1px dotted #CCCCCC;
   clear:both;
}

/* ------- end news --------- */
Ben

Re: News template

Posted: Mon 2. Jun 2008, 17:31
by update
Many thanks for sharing, Ben!
Which version did you use for that one? Some rXXX...?

Re: News template

Posted: Mon 2. Jun 2008, 18:25
by oeconom
360fusion,
thanks for sharing!
Do you have an example online?

Best wishes,
Felix

Re: News template

Posted: Mon 2. Jun 2008, 23:41
by Jensensen
Thanx a lot, Ben!

How to add News with 1.3.9 dev r_xyz ??

Re: News template

Posted: Tue 3. Jun 2008, 09:43
by 360fusion
Sorry, I don't have an online example as i just have it set up with SVN on Localhost.

it is the latest version of phpwcms as of today with the SVN but believe the news section has been in for a while now with fixes being made every now and then.

Content part
To add news create an article and add the news content part. I've found that you need to specify a language in both the news content part and news article, English = en
type a name in the archive and news article boxes, i use type 'archive' and 'article'
Then save.

News article
The articles are pretty straight forward.
click on news on the left nav
create new news article
fill in all the boxes needed.
Add title (leave the title/alias at the top as this will be based on main title automatically)
fill in language English = en
put text in teaser and in the wysiwyg
check publish
create

Job Done!

Hope this helps
Ben

Re: News template

Posted: Tue 3. Jun 2008, 10:21
by juergen
add the news content part.
:shock: but where is this ????

Re: News template

Posted: Tue 3. Jun 2008, 10:28
by pepe
Hi DF6IH.... putz mal deine Brille und sieh mal in der "unsortierten" (wieso eigentlich) CP-Liste nach...

Na, gefunden???
Ich wußte, daß ich mich auf dich verlassen kann :-)

Re: News template

Posted: Tue 3. Jun 2008, 12:45
by juergen
Pepe. ich habe keine (mmmhmm fast keine ) Brille .. und ich brauche auch noch keine .. wie üblich ist der Contenpart da wo ich ihn brauche noch (!!) nicht drin,,

and Ben, thank you, I just needed this german flyout to make shure (for pepe) that my original eyeballs are ok :D the cp news swaps in from 1.3.9 to 1.3.9 :D

Re: News template

Posted: Wed 11. Jun 2008, 12:48
by baklavoni
i cannot find News CP. :P
my version is 1.3.9

Re: News template

Posted: Wed 11. Jun 2008, 18:01
by nebenaube
baklavoni wrote:i cannot find News CP. :P
my version is 1.3.9

if you've upgraded from a prior version... that is if you already had your structure defined. Then you need to go into 'Admin' select the page (for lack of a better term) where you want to be able to use the news cp and enable the content part. There are several new CP's in there. This makes the CP's available when you create a article in the chosen structure level (page).

Re: News template

Posted: Thu 12. Jun 2008, 13:50
by 360fusion
To help set up the news sections this is the information i put in the news cp and news article.

This is how my news content part is set out
News content part
News content part
This is how the news article is set out
News article
News article
Ben

Re: News template

Posted: Thu 12. Jun 2008, 18:04
by Dan-G
This looks interesting.

Is it possible to have more than one image (from file manager) in the article?

What about including video in an article?

In fact I'm now feeling a little confused about how this is progress (I'm sure it is, I just haven't understood yet) when articles always allowed the incorporation of many CPs.

Re: News template

Posted: Thu 12. Jun 2008, 18:23
by nebenaube
I agree, it would be nice if the file manager and the wysiwyg editor's file management were harmonized. Of course, you have the choice of segregating images between the two and anything can be embeded within the wysiwyg editor's content but as I understand the functionality; one has to actually code some things rather than use CP's.

Re: News template

Posted: Thu 12. Jun 2008, 18:49
by 360fusion
I have created a news type system before by using normal articles, content parts and the teaser/link article content part. This allows you to add all kinds of other media.

It is a bit awkward but i create a structure level called 'news'
then create a sub structure of 'news' called 'news articles'
I then add an article to the 'news' structure level and add the teaser/link article cp and set it to list any articles under the 'news articles' structure level.
I then add a article to the 'news articles' structure level and by create a news storey page using normal content parts. like the text/w image and any other cp like images or multimedia

Home
home page article
-News
-News - teaser cp
--News Articles
--News stroy about cats - All articles under this structure level are displayed in the teaser cp under 'News'
--Another news story
--more news

I have to create two structure levels to sort the articles, if i just created one article like 'news' every time i would add a new article/news story it would push the main teaser cp down the list and this wouldn't then bring in any other news story's/articles.

It would be good if you could make an article 'sticky' like in a forum where the article would always stay at the top. very handy for using the teaser/article link content part for things like this

This new news feature is a great way for letting clients add news storeys to their websites without having to create new article or add content parts. its simple and does the job of adding a text news story with an image. ease of use for my clients is what i need and this new news feature provides that. I'm loving it!

Ben

Re: News template

Posted: Thu 12. Jun 2008, 18:54
by 360fusion
More screen shots
news.jpg
news_article_information.jpg