header eintrag in externe datein auslagern

**tlcms** · 19.08.2010, 04:55

hallo

<link rel="stylesheet" href="isstyle.css" type="text/css" media="screen" /
<script type="text/javascript" src="is.js"></script>

würde mir besser gefallen als:

Code:

<style type="text/css" media="screen">
<!--/*--><![CDATA[/*><!--*/
/*is-css-start*/
#elements2 {position:absolute;}
.mask2 { width:450px; height:190px; position:relative; overflow:hidden;}
.mask2 img { position:absolute; display:block; border:none; } 
/*is-css-end*/
/*]]>*/-->
</style>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready',function()
{
//is-js-start
	var V2 = new viewer( $$('#elements2 img)' ),
	{
		sizes: {w:450,h:190},
		mode: 'rand',
		modes: ['alpha'],
		fxOptions:{ duration: 5000  },
		interval: 3000
	});
	V2.play(true);;
//is-js-end
});
//--><!]]>
</script>

kann man da was machen?

LG
TL

**ees** · 19.08.2010, 07:35

Hast du es schon getestet?

Grüße

ees

**tlcms** · 19.08.2010, 08:22

nee... ich weiss ja nicht wie^^

**ees** · 19.08.2010, 08:27

Sicherung des Code's machen und an dir richtigen Stellen deinen neuen Einfügen!
Dann testen...

Grüße

ees

**tlcms** · 19.08.2010, 08:36

manuell könnte ich den Code ja in eine style und js Datei kopieren und im head sauber einfügen. Dann könnte ich ja aber nicht mehr bequem die werte übers backend verändern^^

Das wäre halt meine notlösung

**ees** · 19.08.2010, 08:45

Ich würde den Code da verändern wo er ist!
Du kannst auch probieren ein neues Stylesheet anzulegen mit dem "Selektor" auf deinen header und ganz unten unter "Eigener Code" mal probieren deinen zu schreiben! Kann dir aber nicht sagen ob das funzt?

Grüße

ees

**kos** · 19.08.2010, 08:55

Hallo tlcms,

vielleicht hift Dir dieser Link ja weiter.

**tlcms** · 19.08.2010, 09:49

hy kos

header_code habe ich schon installiert... wie gesagt einfach so zusammenschustern kriege ich schon hin ^^

es ging mir halt darum ob es vielleicht möglich währe an den Daten ContentImageslider.php und ModuleImageslider.php zuschrauben ...

Code:

 /** --------------------------------------------------------------------
	  * Add CSS and JS to <head>
	  * 
	  * Check if data has been already added to avoid multiple entries.
	  * If Imageslider CSS or JS has been added append data to existing entry
	  * -------------------------------------------------------------------- */
		$GLOBALS['TL_JAVASCRIPT'][] = 'plugins/imageslider/class.viewer.js';

	//-- CSS ----------------------------------------------------- 
	$x = 0;
	if (is_array($GLOBALS['TL_HEAD']))
	{
		foreach($GLOBALS['TL_HEAD'] as $headElements)
		{
			$CSSpresent = strpos($headElements, '/*is-css-end*/');
			if ($CSSpresent !== false) 
			{
				$CSSArrayPos = $x;
				$CSSAdded = true;
			}
			
			$x++;	
		}
	}

	if ($CSSAdded) 
	{

$GLOBALS['TL_HEAD'][$CSSArrayPos] =	str_replace('/*is-css-end*/', '/*is-css-end*/
/*is-css-start' . $objSettings->id . '*/
#elements' . $objSettings->id . ' {position:absolute;}
.mask' . $objSettings->id . ' { width:' . $arrImageslider[0] . 'px; height:' . $arrImageslider[1] . 'px; position:relative; overflow:hidden;}
.mask' . $objSettings->id . ' img { position:absolute; display:block; border:none; } ' . $controlButtons . '
/*is-css-end' . $objSettings->id . '*/',
$GLOBALS['TL_HEAD'][$CSSArrayPos]);		

	} 
	else 
	{

   	$GLOBALS['TL_HEAD'][] ='<style type="text/css" media="screen">
<!--/*--><![CDATA[/*><!--*/
/*is-css-start*/
#elements' . $objSettings->id . ' {position:absolute;}
.mask' . $objSettings->id . ' { width:' . $arrImageslider[0] . 'px; height:' . $arrImageslider[1] . 'px; position:relative; overflow:hidden;}
.mask' . $objSettings->id . ' img { position:absolute; display:block; border:none; } ' . $controlButtons . '
/*is-css-end*/
/*]]>*/-->
</style>';

	}		
		


	//-- JS ----------------------------------------------------- 
		
	$GLOBALS['TL_HEAD'][] = "<script type=\"text/javascript\">
<!--//--><![CDATA[//><!--
window.addEvent('domready',function()
{
//is-js-start
	var V" . $objSettings->id . " = new viewer( $$('#elements" . $objSettings->id . " img)' ),
	{
		sizes: {w:" . $arrImageslider[0] . ",h:" . $arrImageslider[1] . "},
		mode: 'rand',
		modes: [" . $EffectType . "],
		fxOptions:{ duration: " . $objSettings->effect_duration . " " . $EffectsExtended . " },
		interval: " . $objSettings->rotation_interval . "
	});
	$play;
//is-js-end
});
//--><!]]>
</script>";

vielleicht irgendwas mit TL_HEAD oder so

php bin ich nicht gerade der stärkste^^

**Schlauchbeutelmaschine** · 19.08.2010, 13:16

Hallo!

Die Idee mit den externen Dateien ist natürlich für die Seitengröße und Cache besser als wenn der Code direkt reingeschrieben wird. Allerdings benötigt das Handling von Dateien mit PHP auch eine gewisse Zeit, so dass die Ladezeit dann wieder länger wird.

Und wie man ja in Leo's "Google Optimierungsbericht" lesen kann, ist in diesem Fall die Einbindung mehrere Dateien im Gegensatz zu ein paar Zeilen Code im Quelltext eher schlechter.

Die optimale Lösung für die Dateieinbindung wäre, wenn beim Speichern im Backend abgefragt wie viele Imageslider es gibt und dann für alle jeweils eine komprimierte CSS und JS Datei erstellt.

Ich könnte aber in der nächsten Version den Quelltext komprimieren, so dass er nur noch einzeilig ist.