SOLVED : How to style the 'morelink' in the news module

[Eskymo]

using cmsms v1.2 and news module 2.5.1

I can't find anywhere how to change the linkto my news stories from the news summary on my homepage. the text More appears automatically and I want this to change to read more and styled like all the other read more links on my site which use the following styles:

Code: Select all

.readmorelink {
	color: #C8025B;
	padding-right: 10px;
	background: url(uploads/images/assets/subnav_arrow.gif) no-repeat right center;
}
.readmorelink:hover {
	color: #C8025B;
	text-decoration: underline;
}

Where can I change the text that appears i.e 'More' and apply the style for the link? It the bit that is called using:

Code: Select all

<div class="NewsSummaryMorelink">
	[{$entry->morelink}]
</div>

[Eskymo]

while I'm still trying to style my news, I don't understand why the styles I am applying within the news module stylesheet won't apply at all. For instance I am trying to add 10px padding to the bottom of each as well as a 1 pixel dotted bottom border like so:

Code: Select all

.NewsSummary {
padding-bottom: 10px;
border-bottom: 1px dotted #C8025B;
}

and these style additions just don't show up at all. I don't understand why.

[lollipop27]

well have you read the documentation for the news module?

1.

Go to the overview of all you modules, click on News and then there is a page where every option is explained... there is also an option which is callled like this (sorry, its german... didn't want to change the admin panel)

(optional) moretext="more..." - Mit diesem Parameter wird der Text festgelegt, der am Ende einer News-Zusammenfassung angezeigt wird, wenn der Artikel länger als die vorgegebene Länge ist. Standard ist "Weiterlesen ..."


2.

the style:

did you add the news stylesheet to you templete? if not, do that first....

(for your second post.... we posted at the same time.... 

then go to the news stylesheet its called something like "Modules:news" in the standard installation...

see here.... the class name is NewsSummaryMorelink

Where can I change the text that appears i.e 'More' and apply the style for the link? It the bit that is called using:

Code: Select all

<div class="NewsSummaryMorelink">
	[{$entry->morelink}]
</div>

go to your stylesheet and search for that..... then style!


----


good luck

[Eskymo]

I've read the news module help...the part you mention says:

(optional) moretext="more..." - Text to display at the end of a news item if it goes over the summary length. Defaults to "more..."

Doesn't tell you how to change the text from 'More' to something else though. I want my link to say 'read more' and have the same style as my other readmore links.

[lollipop27]

well.... so??

you say then {news moretext="read more"}... so easy!!


for the style, did you change the news stylesheet??

[Eskymo]

are you impying I need to replace

Code: Select all

{$entry->morelink}

with

Code: Select all

{news moretext="read more"}

Will that still create a dynamic link to my news story?

[lollipop27]

nooo.... now  i see your problem...

go to the page/template, where you added the tag {news}

and then add the option.... understand now? not in the php code.... just in the page/template!

its much easier than you think!

[Eskymo]

still having problem styling the link...

I've created the floowing style in the stylesheet:

Code: Select all

.NewsSummaryMorelink {
color: #C8025B;
padding-right: 10px;
background: url(uploads/images/assets/subnav_arrow.gif) no-repeat right center;
}

.NewsSummaryMorelink:hover {
	color: #C8025B;
	text-decoration: underline;
}

but can't apply this to the readmorelinks. Adding the style to the paragraph tag around the links like so:

Code: Select all

<p class="NewsSummaryMorelink">{$entry->morelink}</p>

puts my arrow graphic at the right hand side of the page as it's associated with the paragraph not the link. If I then put the style with the link like this:

Code: Select all

<p>{$entry->morelink class="NewsSummaryMorelink"}</p>

the arrow graphic just doesn't appear. When looking at the source code of the page the read more link has no styles applied to it.

Any ideas?

[lollipop27]

post the url to your side please....


why changing the news template..... i never needed to.... there is already a class given...

[Eskymo]

http://www.techsinthecity.co.uk/devsite/index.php?page=news

that's a link to my news page.

[Dr.CSS]

I see no p class only this, you must have changed the default news template...


This is the summary of the groundbreaking story I'm about to post. This is the summary of the groundbreaking story I'm about to post.
read more


This would have needed p.NewsSummaryMorelink {your style}

{$entry->morelink}

[Eskymo]

that's cos I took the class out of the tag as it didn't work - it placed the arrow graphic on the extreme right of the page rather than just after the link.

i will have a go at what you suggest and see if that works.

Thank you both for perservering with me on this one!

[Eskymo]

http://www.techsinthecity.co.uk/devsite/index.php?page=news

see the tiny arrow graphic on the right of the page...that's what I want appearing right after the link and in order to get it right after the link I need the class="style" to be within the a href tag...any ideas?

[Eskymo]

I also can't find where I can change the 'Return' text to be something like 'back to news' instead. Why does it have to be so complicated?

[lollipop27]

add this to your p tag....

padding: 0 10px;
display: inline;