Wo ist die index.html

Deutsches Forum
1

Hallo,

bin relativ neu und versuche im Moment den Shop zu verstehen und auch so einige andere Dinge bei der Anpassung. Ich möchte gerne einen Nivo Slider in die Starttseite einbinden. Auf einer Testdomain klappt das auch, alles in einer einzigen index.html-Datei. Mit installiertem Firebug bekomme ich die Infos, dass es die Header und die Body Section gibt. Nun bin ich in den Shop-Dateien auf der Suche nach genau dieser Stelle, wo ich .js-Files und auch den Slider-Code einbinden muss, diese Stellen kann ich aber beim besten Willen nicht finden.

Kann jemand der Profis helfen ?:confused:

2

/out/basic/_header.tpl => header (Javascript, Meta Angaben usw)
/out/basic/start.tpl => Startseite

3

Perfekt, super schnelle Antwort. Werde ich gleich mal ausprobieren. DANKE !!

Habs inzwischen getestet. Und hat leider nicht geklappt… Also, mein “Problem”…

Mit Firebug kann man ja den Inhalt der _header.tpl ansehen. Das wird ja alles generiert mit Variablen. Selbst <html lang=“de”> wird generiert. Wenn ich nun den Text des Nivo SLiders direkt vor </head> einfüge, passiert nichts. Firebug zeigt mir diese Textzeilen auch nicht, also wurden sie auch nicht eingebunden.

Mache ich das vielleicht doch in der falschen Datei?

4

Hi Fmuhlen,

die Dateien für den NivoSlider müssen so in der _header.tpl eingefügt werden:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html[{if $oView->getActiveLangAbbr()}] lang="[{ $oView->getActiveLangAbbr() }]"[{/if}] [{if $oViewConf->getFbAppId()}]xmlns:fb="http://www.facebook.com/2008/fbml"[{/if}]>
<head>
    [{assign var="_titlesuffix" value=$_titlesuffix|default:$oView->getTitleSuffix()}]
    
    [{assign var="_titleprefix" value=$_titleprefix|default:$oView->getTitlePrefix() }]
    [{assign var="title" value=$title|default:$oView->getTitle() }]
    <title>[{ $_titleprefix }][{if $title&& $_titleprefix }] | [{/if}][{$title|strip_tags}][{if $_titlesuffix}] | [{$_titlesuffix}][{/if}][{if $titlepagesuffix}] | [{$titlepagesuffix}][{/if}]</title>
    <meta http-equiv="Content-Type" content="text/html; charset=[{$charset}]">
    [{if $oView->noIndex() == 1 }]
    <meta name="ROBOTS" content="NOINDEX, NOFOLLOW">
    [{elseif $oView->noIndex() == 2 }]
    <meta name="ROBOTS" content="NOINDEX, FOLLOW">
    [{/if}]
    [{if $oView->getMetaDescription()}]<meta name="description" content="[{$oView->getMetaDescription()}]">[{/if}]
    [{if $oView->getMetaKeywords()}]<meta name="keywords" content="[{$oView->getMetaKeywords()}]">[{/if}]
    [{assign var="canonical_url" value=$oView->getCanonicalUrl()}]
    [{if $canonical_url }]<link rel="canonical" href="[{ $canonical_url }]">[{/if}]
    <link rel="shortcut icon" href="[{ $oViewConf->getBaseDir() }]favicon.ico">
    <link rel="stylesheet" type="text/css" href="[{ $oViewConf->getResourceUrl() }]oxid.css">
    <!--[if IE 7]><link rel="stylesheet" type="text/css" href="[{ $oViewConf->getResourceUrl() }]ie7.css"><![endif]-->
    <!--[if IE 8]><link rel="stylesheet" type="text/css" href="[{ $oViewConf->getResourceUrl() }]ie8.css"><![endif]-->
    <script src="[{ $oViewConf->getResourceUrl() }]jquery.js" type="text/javascript"></script>
    <script src="[{ $oViewConf->getResourceUrl() }]nivoslider.js" type="text/javascript"></script>
    <script src="[{ $oViewConf->getResourceUrl() }]myinits.js" type="text/javascript"></script>

Und in einem extra Javascript, welches ebenfalls noch im Header eingebunden werden muss, die Initialisierung des Sliders aka:

(myinits.js)



$(document).ready(function()
{

	/* init Events in content */
	var thisParent = thisParent || $("body");
	initEvents(thisParent);

});

/* Init basic events and effects */
function initEvents(thisParent)
{
  initNivoSlider();
}

function initNivoSlider(){
  $('#slider').nivoSlider({
  		effect: 'random',
  		slices: 15,
  		animSpeed: 1000,
  		pauseTime: 4000,
  		startSlide: 0, //Set starting Slide (0 index)
  		directionNav: false, //Next & Prev
  		directionNavHide: false, //Only show on hover
  		controlNav: false, //1,2,3...
  		controlNavThumbs: false, //Use thumbnails for Control Nav
  		controlNavThumbsSearch: '.jpg', //Replace this with...
  		controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image src
  		keyboardNav: false, //Use left & right arrows
  		pauseOnHover: false, //Stop animation while hovering
  		manualAdvance: false, //Force manual transitions
  		captionOpacity: 0.8, //Universal caption opacity
  		beforeChange: function(){},
  		afterChange: function(){},
  		slideshowEnd: function(){} //Triggers after all slides have been shown
  	});
}

Dann noch ein DIV, da wo der Slider ausgegeben werden soll:


<div id="slider">
  [{oxifcontent ident="oxslideshow" object="oCont"}]
    [{$oCont->oxcontents__oxcontent->value}]
  [{/oxifcontent}]
</div>

Dann noch eine neue CMS Seite anlegen mit der ID oxslideshow und dort Bilder reinklatschen, die geslided werden sollen.

Viele Grüße vom Chris

5

[QUOTE=fmuehlen;42927]Perfekt, super schnelle Antwort. Werde ich gleich mal ausprobieren. DANKE !!

Habs inzwischen getestet. Und hat leider nicht geklappt… Also, mein “Problem”…

Mit Firebug kann man ja den Inhalt der _header.tpl ansehen. Das wird ja alles generiert mit Variablen. Selbst <html lang=“de”> wird generiert. Wenn ich nun den Text des Nivo SLiders direkt vor </head> einfüge, passiert nichts. Firebug zeigt mir diese Textzeilen auch nicht, also wurden sie auch nicht eingebunden.

Mache ich das vielleicht doch in der falschen Datei?[/QUOTE]

Und womöglich danach noch den TMP-Ordner leeren… :slight_smile:

6

Danke, Chris (und Daniel),

klapt mehr schlecht als recht …

Ich krieg irgendwie die ControlNavs (1,2,3…) nicht weg, weder bei der Einstellung false, noch bei true oder auskommentieren. Auch die anderen Einstellungen in der myinits.js kann ich weder aktivieren ncoh deaktivieren…

Ansonsten hats gekpapt, danke vielmals !!

7

…und ich bekomme auch nicht die 1,2,3,4 weg und die arrows werden auch nicht angezeigt. Bei mir steht nur Prev und Next.

Hat jemand einen Plan davon??

8

Das sieht nach fehlenden/falschen CSS-Formatierungen aus. Vergleich die betroffenen Bereiche mal mit der Vorlage.

9

Habe ich grade schon gemacht. Habe mir die Seiteninformation angeschaut und die CSS mit meiner verglichen, ist identisch.

/*
 * jQuery Nivo Slider v2.3
 * http://nivo.dev7studios.com
 *
 * Copyright 2010, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * March 2010
 */
 
 
/* The Nivo Slider styles */
.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:60;
	display:none;
}
/* The slices in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:50;
	height:100%;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	bottom:0px;
	background:#000;
	color:#fff;
	opacity:0.8; /* Overridden by captionOpacity setting */
	width:100%;
	z-index:89;
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
.nivo-caption a {
	display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:99;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:99;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}

und dass hab ich noch in der oxid.css stehen:

#slider {
        position:relative;
        width:608px; /* Change this to your images width */
        height:250px; /* Change this to your images height */
        background:url(images/loading.gif) no-repeat 50% 50%;
    }
    #slider img {
        position:absolute;
        top:0px;
        left:0px;
        display:none;
    }
    #slider a {
        border:0;
        display:block;
    }
10

So…läuft jetzt. Lag daran dass die Slider-css unvollständig war.