Linking to a specific article

Bexxie · 2008-11-16 22:38:21

Ok I’m almost finished with my site but I seem to be having trouble with this particular section. I’ve tried everything I can think of and searched this site, but still can’t figure it out. Here is my issue:

I have a list that I have styled to create a grid of images so when you click on one of them, they go to the article that corresponds with that link. Here is my html code:

<ul>
	<li id="influential" ><a href="#">Influential</a></li>
       <li id="dyne"><a href="#">Dyne</a></li>
       <li id="defwish"><a href="#">Def Wish</a></li>
       <li id="infiltration"><a href="#">Infiltration</a></li>
       <li id="malice"><a href="#">Malice</a></li>
       <li id="kfx"><a href="#">KFX</a></li>
       <li id="remix"><a href="#">Remix</a></li>
       <li id="kniteforce"><a href="#">Kniteforce</a></li>
       <li id="kfa"><a href="#">KFA</a></li>
       <li id="dfa"><a href="#">Dysfunktional Audio</a></li>
       <li id="knitebreed"><a href="#">Knitebreed</a></li>
       <li id="strangeroom"><a href="#">Strange Room</a></li>
       <li id="dubs"><a href="#">Dubs</a></li>
       <li id="mixes"><a href="#">Mixes</a></li>
       <li id="other"><a href="#">Other Labels</a></li>
</ul>

I tried using the perm link tag with the article’s id in the <a href> tag but that doesn’t work. Does anyone have any ideas on how to achieve this or a better way to achieve this?

Thanks in advance!

(edit: added bc. for better code display. -Els)

Last edited by els (2008-11-16 23:33:27)

els · 2008-11-16 23:31:21

Bexxie wrote:

I tried using the perm link tag with the article’s id in the <a href> tag but that doesn’t work.

How did you use it? <a href="<txp:permlink id="123" />">go to article 123</a> should work.

Or are you trying to create a dynamic article list?

Bexxie · 2008-11-17 00:40:59

Thats exactly what I tried and it didn’t work.

Here is the exact code I used:

<li id=“kniteforce”><a href=”<txp:permlink id=“7” />”>Kniteforce</a></li>

The article with an ID of 7 corresponds to the list item “Kniteforce”

colak · 2008-11-17 06:20:40

the code is correct, can you copy paste all the links as they appear in your template here?

Bexxie · 2008-11-19 03:31:19

Colak, I’m not sure what you mean? The code for all my links in the template is posted in my first post.

I also noticed something else when I use the permlink tag. It gives me an error message and says that the template does not use an article tag. I must be missing some code. Maybe a conditional statement? I’m still pretty new to this so if anyone has any ideas I’d greatly appreciate it!

nabrown78 · 2008-11-19 03:39:58

HI Bexxie –
Are you using this code in a page template or in a form? Either way, it would be helpful to see the whole shebang. Any reason you’re not creating the markup by outputting an article list, with a form of something like:

<li id="<txp:article_url_title />"><txp:permlink><txp:title /></txp:permlink></li>

Last edited by nabrown78 (2008-11-19 03:40:16)

els · 2008-11-19 17:35:05

Bexxie wrote:

I tried using the perm link tag with the article’s id in the <a href> tag but that doesn’t work.

It gives me an error message and says that the template does not use an article tag.

Was that what you meant with ‘it doesn’t work’? To display an individual article there must be a <txp:article /> tag on the page template that is supposed to show the article. So if you are using one page template for all sections, it must be on that page. If you are using different page templates for different sections, it must be on the page for the section your article is in.

Bexxie · 2008-11-22 19:08:01

Thanks everyone for your help so far.

Ok so I created an article form called “music” using nabrown78’s suggestion. So the code for that form is:

<div id="music">
<ul>
<li id="<txp:title />"><txp:permlink><txp:title /></txp:permlink></li>
</ul>
</div>

Then in my page template, I called a custom article tag refering to the “music” section that only this page template is made for. Here is the code for that page template:

<txp:output_form form="meta" />

<body>
<div id="container">

<txp:output_form form="header_nav" />
<txp:breadcrumb class="breadcrumbs" link="1" linkclass="breadcrumbs" sep=">" />

<div id="content">
<div id="center">

<txp:article_custom form="music" pgonly="0" section="music" />

</div> 
</div>

<txp:output_form form="footer" /> 

</div> 
</body>
</html>

So now what is happening is when I go to the music section of my site, it is outputting my unordered list, but without the images I associated with it in my style sheet, but when I click on one of the links, then the images appear with my unordered list. But it still doesn’t link to the article in my music section and I still get this error message when I click on one of my links:

Tag error: -> Textpattern Notice: Page template music does not contain a txp:article tag on line 474

Any ideas?? I feel like I must be missing some key bit of code here but have tried everything I can think of and really need to get this site done soon.

(edit: added a couple of bc.s for better code display. -Els)

Last edited by els (2008-11-22 20:06:53)

els · 2008-11-22 20:14:57

First, you need to change your article form:

<txp:if_first_article>
<div id="music">
<ul>
</txp:if_first_article>
<li id="<txp:title />"><txp:permlink><txp:title /></txp:permlink></li>
<txp:if_last_article>
</ul>
</div>
</txp:if_last_article>

Otherwise it will output the div and ul for each and every article in the list.

Your page still doesn’t contain an article tag (‘article tag’ meaning <txp:article />, and not <txp:article_custom />). You need something like this:

<div id="content">
<div id="center">

<txp:if_article_list>
<txp:article_custom form="music" section="music" />
<txp:else />
<txp:article form="your_individual_article_form" />
</txp:if_article_list>

</div> 
</div>

Re the images: can you tell us what is in your CSS?

els · 2008-11-22 20:29:41

Re the images again: I’m pretty sure it’s the <li id="<txp:title />"> that causes the problem with the CSS. <txp:title /> outputs the article’s title as it is, so including capitals, spaces, accents if any, etcetera. So an article title like Strange Room will give you this: <li id="Strange Room">, while in your CSS is #strangeroom.

You’d better change the txp:title tag to article_url_title (and change your CSS accordingly). This will output (for your article Strange Room) strange-room.

Bexxie · 2008-11-22 20:33:54

Thank you Els! It is now linking to my articles, but still no images so here is my css (i’m not sure how you clean up the code to display better):

#music { margin:0; padding:0; background:#fff;

}

#music ul { position:relative; list-style-type:none; width:456px; margin:0; padding:0;
}

#music ul li { float:left; width:151px; padding-bottom:1em; border-right:1px solid #333; border-bottom:1px solid #333;
}

#music ul li a { display:block; text-align:center; color:#333;
}

#music ul li a:hover { color:#830303;
}

#music ul li a:visited { color:#580600;
}

li#influential {background:url(images/influential.jpg) no-repeat 50% 10px; } li#dyne {background:url(images/dyne.jpg) no-repeat 50% 10px; } li#def-wish {background:url(images/defwish.jpg) no-repeat 50% 10px; } li#infiltration {background:url(images/infiltration.jpg) no-repeat 50% 10px; } li#malice {background:url(images/malice.jpg) no-repeat 50% 10px; } li#kfx {background:url(images/kfx.jpg) no-repeat 50% 10px; } li#remix {background:url(images/remix.jpg) no-repeat 50% 10px; } li#kniteforce {background:url(images/kniteforce.jpg) no-repeat 50% 10px; } li#kfa {background:url(images/kfa.jpg) no-repeat 50% 10px; } li#dfa {background:url(images/dfa.jpg) no-repeat 50% 10px; } li#knitebreed {background:url(images/knitebreed.jpg) no-repeat 50% 10px; } li#strange-room {background:url(images/strangeroom.jpg) no-repeat 50% 10px; } li#dubs {background:url(images/dubs.jpg) no-repeat 50% 10px; border-bottom:0px solid #333; } li#mixes {background:url(images/mixes.jpg) no-repeat 50% 10px; border-bottom:0px solid #333; } li#other {background:url(images/otherlabels.jpg) no-repeat 50% 10px; border-bottom:0px solid #333;}

li#influential a, li#dyne a, li#def-wish a,li#infiltration a, li#malice a, li#kfx a, li#remix a, li#kniteforce a, li#kfa a, li#dfa a, li#knitebreed a, li#strange-room a, li#dubs a, li#mixes a, li#other a {padding-top: 120px;}

Also, would you be able explain to me what the code that you gave me in the form and the template are essentially doing? I’m trying to understand the logic of how txp works. Thanks so much for your help!

Bexxie · 2008-11-22 20:39:28

Els wrote:

Re the images again: I’m pretty sure it’s the <li id="<txp:title />"> that causes the problem with the CSS. <txp:title /> outputs the article’s title as it is, so including capitals, spaces, accents if any, etcetera. So an article title like Strange Room will give you this: <li id="Strange Room">, while in your CSS is #strangeroom.

You’d better change the txp:title tag to article_url_title (and change your CSS accordingly). This will output (for your article Strange Room) strange-room.

That worked! I changed my css to include any necessary dashes and used the <txp:article_url_title /> and actually nabrown78 suggested the <txp:article_url_title /> I don’t know why I changed it. Thanks everyone! I can’t wait to share my site with you all when its done :)

Textpattern CMS

Textpattern CMS support forum

#1 2008-11-16 22:38:21

Linking to a specific article

#2 2008-11-16 23:31:21

Re: Linking to a specific article

#3 2008-11-17 00:40:59

Re: Linking to a specific article

#4 2008-11-17 06:20:40

Re: Linking to a specific article

#5 2008-11-19 03:31:19

Re: Linking to a specific article

#6 2008-11-19 03:39:58

Re: Linking to a specific article

#7 2008-11-19 17:35:05

Re: Linking to a specific article

#8 2008-11-22 19:08:01

Re: Linking to a specific article

#9 2008-11-22 20:14:57

Re: Linking to a specific article

#10 2008-11-22 20:29:41

Re: Linking to a specific article

#11 2008-11-22 20:33:54

Re: Linking to a specific article

#12 2008-11-22 20:39:28

Re: Linking to a specific article

Board footer