Jump to content
xt:Commerce Community Forum

Breadcrumb-Navigation


SS156

Recommended Posts

hallo,

könnt Ihr mir sagen wie ich die kleinen pfeile in die "Breadcrumb-Navigation"

einfüge? in der ist stylesheet.css ist es ja bereits standardmässig drin:confused:, nur wird es ja wieso auch immer nicht angezeigt?

gruß

kris

Link to comment
Share on other sites

hallo jespa,

ist auch eine lösung, aber ich wollte es mit kleinen *.gifs machen.

diese sind auch in templates/xt_design/img/bg_breadcrumbarrow.gif standardmässig ja drin:rolleyes: nur wieso wird es nicht angezeigt? denn in der stylesheet.css werden sie ja auch angesprochen? oder ist da irgendwas fehlerhaft? und in keiner veyton installation die ich per google gefunden habe wird es angeszeigt, obwohl es in der css ist???

/* BREADCRUMB PATH AS LIST */

#breadcrumb {clear:both; color:#C64934; padding:1px 0px 10px 15px; background-color:#fff; height:22px; background-image:url(../img/bg_breadcrumb.gif); background-repeat:repeat-x; font-size:11px;}

breadcrumb a, #breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:active {line-height:23px; text-decoration:none; font-weight:normal; cursorpointer;color:#333333; margin:0; padding:0;}

#breadcrumb ul li{display:inline;padding: 0 5px 0 0;margin: 2px 0 0 0;}

#breadcrumb ul{list-style-image: url(../img/bg_breadcrumbarrow.gif);margin:0;padding:0;padding-left: 1em;}

Link to comment
Share on other sites

Also ich habe es mal so gemacht, ich habe mir mal einen Ordner direkt dort wo auch der Plug-In-Ordner, der Temp-Ordner usw. ist angelegt und dort alle Images die ich ansprechen möchte eingefügt. Da klappt es auf jeden Fall.

MFG

Link to comment
Share on other sites

  • 4 weeks later...

Die Grafik is ja schon da, das Problem ist ja nur, das sie nicht ausgegeben wird.

/* BREADCRUMB PATH AS LIST */

#breadcrumb {clear:both; color:#C64934; padding:1px 0px 10px 15px; background-color:#fff; height:22px; background-image:url(../img/bg_breadcrumb.gif); background-repeat:repeat-x; font-size:11px;}

breadcrumb a, #breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:active {line-height:23px; text-decoration:none; font-weight:normal; cursor:pointer;color:#333333; margin:0; padding:0;}



[COLOR="green"]#breadcrumb ul li{display:inline;padding: 0 5px 0 0;margin: 2px 0 0 0;}[/COLOR]


[COLOR="red"]#breadcrumb ul{list-style-image: url(../img/bg_breadcrumbarrow.gif);margin:0;padding:0;padding-left: 1em;} [/COLOR]

MfG. Hansen

Link to comment
Share on other sites

  • 3 months later...

Ich grabe diesen Thread nochmal raus weil ich leider keine saubere Lösung finde.

Mit dem CSS das Ganze anzupassen ist wirklich kompliziert. Man kann nicht nachvollziehen was da gemacht wurde :o

Ich habe jetzt auch in der Breadcrumb.html das Zeichen angehangen:

<ul>

{foreach name=aussen item=breadcrumb from=$top_navigation}

<li><a class="pathway" href="{$breadcrumb.url}" title="{$breadcrumb.name}">{$breadcrumb.name} »</a></li>

{/foreach}

</ul>

Jetzt wird das natürlich aber auch auf dem letzten Brotkrumen angezeigt, das schaut dann so aus:

Startseite >>

oder

Startseite >> Kategorie1 >>

Jemand eine Ahnung wie ich das dort wieder wegbekommen könnte?

Link to comment
Share on other sites

wieso kann man das nicht nachvollziehen ?

der breadcrump ist eine normale <ul> Liste, die kann man formatieren wie man möchte per css.

Es funktioniert aber einfach nicht wie es soll. Mal ist die Liste dann wieder untereinander, dann zeigt er das Symbol nicht an, dann zeigt er das Symbol links zu viel an, rechts zu viel...

Habe es nun so in der breadcrumb.html gelöst:


{foreach name=aussen item=breadcrumb from=$top_navigation}

	{if $smarty.foreach.aussen.iteration == $top_navigation|@count}

	<li><a class="pathway" href="{$breadcrumb.url}" title="{$breadcrumb.name}">{$breadcrumb.name} </a></li>


	{else}

	<li><a class="pathway" href="{$breadcrumb.url}" title="{$breadcrumb.name}">{$breadcrumb.name} »</a></li>

	{/if}

{/foreach}

Link to comment
Share on other sites

  • 1 month later...

Hallo,

das auch die vernünftigste Lösung, mit CSS hast du dich ja total verbogen.

Viele Grüße,

df:bug

Das ist aber Teil der Standardinstallation von Veyton ;)

Ich habe auch nach Lösungen mittels CSS gesucht, da muss ja irgendein Fehler drin sein.

Aber letztendlich ist es einfacher, es auf andere Weise zu lösen, bevor man graue Haare kriegt.

Link to comment
Share on other sites

  • 2 months later...

Ich habe es auf diesem Weg gelöst:


<ul>
{foreach name=aussen item=breadcrumb from=$top_navigation}
<li><a class="pathway" href="{$breadcrumb.url}" title="{$breadcrumb.name}">{$breadcrumb.name}</a></li>{if $smarty.foreach.aussen.last != 1}<img src="{$tpl_path}img/bg_breadcrumbarrow.gif" alt="" border="0" style="padding-left: 4px; padding-right: 4px;">{/if}
{/foreach}
</ul>
[/PHP]

Die bg_breadcrumbarrow.gif ist in meinem Fall 5x7px groß.

Die Zeile im CSS habe ich komplett auskommentiert.

Ich habs mal angehängt, falls es jemand als Vorlage möchte.

post-56248-14337914965058_thumb.jpg

post-56248-14337914965147_thumb.gif

Link to comment
Share on other sites

  • 6 months later...

Da dieses Thema wohl immer wieder hoch kommt und ich auch gerade etwas getüfftel habe wollte ich einfach einmal meine Lösung zeigen. Somit ist kein Eingriff in die Dateien notwendig, nur CSS:

breadcrumb a, #breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:active {line-height:23px; text-decoration:none; font-weight:normal; cursor:pointer;color:#333333; [B][COLOR="Red"]margin:0 0 0 1em;[/COLOR][/B] padding:0;}

[/B]}



#breadcrumb ul li{display:inline;padding: 0px 5px 0 0;margin: 2px 0 0 0; [B][COLOR="Red"]background-image:url(../img/bg_breadcrumbarrow.gif); background-position:center left; background-repeat:no-repeat;[/COLOR][/B]}

[B][COLOR="Red"]#breadcrumb ul[/COLOR][/B]{margin:0;padding:0;}

Somit wird das Listen-Icon als Hintergrundbild des jeweiligen <li>-Listenelements angezeigt und gut ists ;-)

Vielleicht hilft es ja dem einen oder anderen.

Link to comment
Share on other sites

  • 3 months later...

Da dieses Thema wohl immer wieder hoch kommt und ich auch gerade etwas getüfftel habe wollte ich einfach einmal meine Lösung zeigen. Somit ist kein Eingriff in die Dateien notwendig, nur CSS:

breadcrumb a, #breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:active {line-height:23px; text-decoration:none; font-weight:normal; cursor:pointer;color:#333333; [B][COLOR="Red"]margin:0 0 0 1em;[/COLOR][/B] padding:0;}

[/B]}



#breadcrumb ul li{display:inline;padding: 0px 5px 0 0;margin: 2px 0 0 0; [B][COLOR="Red"]background-image:url(../img/bg_breadcrumbarrow.gif); background-position:center left; background-repeat:no-repeat;[/COLOR][/B]}

[B][COLOR="Red"]#breadcrumb ul[/COLOR][/B]{margin:0;padding:0;}

Somit wird das Listen-Icon als Hintergrundbild des jeweiligen <li>-Listenelements angezeigt und gut ists ;-)

Vielleicht hilft es ja dem einen oder anderen.

da gibts so eine elegante lösung und der fehler ist in der neuesten version immer noch nicht behoben :eek:

Link to comment
Share on other sites

  • 2 months later...
  • 9 months later...

Hallo,

mich jetzt bitte nicht überfordern. ;)

Es ging ja darum, daß die Breadcrumbs nach einer Installation oder Update nicht partout angezeigt werden (Startseite >> Kategorie...).

In der Stylesheet.css (templates/xt_defaults/css) sind sie bei Zeile 65-72 drin, aber werden nicht angezeigt.

Wie das geändert werden kann, ist ja glaube ich auch hier im Beitrag zu finden.

Hier mal der Bereich aus genannter stylesheet.css:

/* BREADCRUMB PATH AS LIST */

#breadcrumb {clear:both; color:#C64934; padding:1px 0px 10px 15px; background-color:#fff; height:22px; background-image:url(../img/bg_breadcrumb.gif); background-repeat:repeat-x; font-size:11px;}

breadcrumb a, #breadcrumb a:link, #breadcrumb a:visited, #breadcrumb a:hover, #breadcrumb a:active {line-height:23px; text-decoration:none; font-weight:normal; cursor:pointer;color:#333333; margin:0; padding:0;}

#breadcrumb ul li{display:inline;padding: 0 5px 0 0;margin: 2px 0 0 0;}

#breadcrumb ul{list-style-image: url(../img/bg_breadcrumbarrow.gif);margin:0;padding:0;padding-left: 1em;}

Oder habe ich jetzt etwas falsch verstanden mit id/class? :D

Herzliche Grüße

Nils

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
  • Create New...