Demo

Probiere ClanSphere aus und teste daran herum. Demo


Antworten: 3
Seite [1]
mawes


Rock the board




Beiträge: 69
 # Thema - 07.12.2012 um 15:08 Uhr
Hallo,

ich möchte die news recent (startseite) so gestalten :
http://www.fc-koeln.de/startseite/ ...
das ich mehrere Tabs zu verschiedenen Newskategorien habe.

Wie baue ich das in der recent.tpl ein ?

habe folgendes gemacht

recent.tpl... +-
 
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
1. / 2. / ... 
 <table style="width:726px;" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>{multislide:navslide:ms_special=rd}</td>
  </tr>
  </table>
  
 <table style="width:726px;" cellpadding="0" cellspacing="0" border="0">
  <tr>
    <td style="width:225px; margin-right:10px; float:left;">
    <div class="rightnav" style="height:180px">???</div>
    <div class="rightnav" style="height:117px; background:#000; color:#FFF">Mitglied</div>
    <div class="rightnavbottom" style="height:220px">Umfrage</div></td>
    <td style=" vertical-align:top; border:10px solid #000;">
    
    <div id="tabsholder">

        <ul class="tabs">
            <li id="tab1">Verein</li>
            <li id="tab2">Herren</li>
            <li id="tab3">Jugend</li>
            <li id="tab4">Futsal</li>
        </ul>
        <div class="contents marginbot">

            <div id="content1" class="tabscontent">Kategorie 1</div>
            <div id="content2" class="tabscontent">Kategorie 2</div>
            <div id="content3" class="tabscontent">Kategorie 3</div>
            <div id="content4" class="tabscontent">Kategorie 4</div>
        </div>
    </div>
    {loop:news}
      <table style="vertical-align:top; width:462px; margin-top:10px; float:left; border-bottom:1px solid #CCC" cellpadding="0" cellspacing="10" border="0">
        <tr>
          <td>{if:catimg}<img src="{page:path}{news:url_catimg}" style="width:120px; height:80px; float:left; margin-right:8px;" alt="" />{stop:catimg}
            {news:news_time} - {news:categories_name}<br />
            <a href="{url:news_view:id={news:news_id}}" style="font-size:14px; font-weight:bolder">{news:news_headline}</a><br />
            {news:news_text}{news:news_readmore}<br /></td>
        </tr>
      </table>
      {stop:news}</td>
</table>


index.htm... +-
 
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
1. / 2. / ... 
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>{func:title}</title>

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="tytabs.jquery.min.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
    $("#tabsholder").tytabs({
                            tabinit:"2",
                            fadespeed:"fast"
                            });
    $("#tabsholder2").tytabs({
                            prefixtabs:"tabz",
                            prefixcontent:"contentz",
                            classcontent:"tabscontent",
                            tabinit:"3",
                            catchget:"tab2",
                            fadespeed:"normal"
                            });
});
-->
</script>
<style type="text/css">
<!--

.marginbot {
margin-bottom:15px;
}

ul.list li {
list-style-type:none;
margin-left:20px;
}

ul.tabs {
width:100%;
overflow:hidden;
}

ul.tabs li {
list-style-type:none;
display:block;
float:left;
color:#fff;
padding:8px;
margin-right:2px;
border-bottom:2px solid #2f2f2f;
background-color:#1f5e6f;
-moz-border-radius: 4px 4px 0 0;
-webkit-border-radius: 4px 4px 0 0;
cursor:pointer;
}

ul.tabs li:hover {
background-color:#43b0ce;
}

ul.tabs li.current {
border-bottom:2px solid #43b0ce;
background-color:#43b0ce;
padding:8px;
}

.tabscontent {
border-top:2px solid #43b0ce;
padding:8px 0 0 0;
display:none;
width:100%;
text-align:justify;
}
-->
</style>
</head>


und halt noch die datein die dabei waren ins hauptverzeichnis gepackt tytabs.jquery.min und jquery.min
habe ich von der seite hier: http://www.htmldrive.net/items/show/1023/Very-Simple-jQuery-Tabs

aber irgendwie zeigt er mir nur die obere reihe an nicht das was im containe rist...
kanns leider noch nicht zeigen da noch kein Webspace arbeite Offline!

Danke füpr eure Hilfe!
Inaktiv
gamermazzo


Going for pro




Beiträge: 450
 # Antwort: 1 - 08.12.2012 um 00:22 Uhr
versuchs mal mit : {func:javascript}

 
1.
2.
3.
4.
5.
6.
7.
8.
1. / 2. / ... 
 

{func:javascript}
<script XXXXXX </script>
<script XXXXXX </script>
</body>
</html>


------------------
Gruß

Mazzo

Inaktiv
|
mawes
Thread-Ersteller


Rock the board




Beiträge: 69
 # Antwort: 2 - 08.12.2012 um 13:47 Uhr
Top , Ich danke dir
da muss man erst einmal drauf kommen!


wenn ich nun den platzhalter {url:news_recent:where=X} den tabs zuordne bekomme ich nur den link , wie wird mir der inhalt angezeigt?

wenn ich {news_recent:where=X} bekomme ich -> m[0] news_recent - m[1] where=44 -

Danke


Zuletzt editiert von mawes am 08.12.2012 um 13:55 Uhr (2x Editiert)
Inaktiv
|
gamermazzo


Going for pro




Beiträge: 450
 # Antwort: 3 - 08.12.2012 um 18:12 Uhr
kannst du mir evtl. mal den link zu deiner Homepage hier oder per PM posten ? =)

wobei der erste Platzhalter ja nur ein Link wäre (url
der zweite Stimmt nicht ganz, ich schaue mal nach =)

hab gerade keine Zeit zum testen aber so ist es bei dem einbinden von statischen Seiten:
 
1.
2.
3.
1. / 2. / ... 
 
{static:view:id=1}


solch einen Aufbau wird es bei den News auch geben, nur musst du eben statt ID das mit dem Befehl für Kategorien machen (sry weiß ich grade nicht)

Falls "where" stimmt sieht das vermutlich so aus:

{news:recent:where=X}
{news:news_recent:where=X}


------------------
Gruß

Mazzo

Zuletzt editiert von gamermazzo am 08.12.2012 um 19:00 Uhr (2x Editiert)
Inaktiv
|
Antworten: 3
Seite [1]


Sie müssen sich registrieren, um zu antworten.