Fancybox auf eigener Seite

dommmxxx · 10. Juli 2014

Hallo ich hab folgendes Problem:
Ich will auf einer eigenen Seite in TekBASE eine Fancybox einbinden,
Dazu habe ich den Code erst einmal mit einem html Dokument getestet.
Dort geht auch alles, nur wen ich den Code in eine eigene Seite einfüge gehtâ€™s nicht mehr.
Der Pfad zu den Bildern, css und js Dateien ist tekbase/fancy
Die Bilder werden auch angezeigt daher kann es am Pfad nicht Ligen
hier mal ein verkürzter Code

HTML

<html>
<head>




<script type="text/javascript" src="tekbase/fancy/lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="tekbase/fancy/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="tekbase/fancy/source/jquery.fancybox.css?v=2.1.5" media="screen" />


<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>


</head>
<body>


<a class="fancybox" href="#inline1" title="test">[img]tekbase/fancy/test.png[/img]</a>


<div id="inline1" style="width:600px;display: none;padding:10px;">
hallo test


</body>
</html>

Alles anzeigen

celltek · 10. Juli 2014

die Scripte sowie stylesheet in themes/javascript.php schreiben oder in overall_footer.tpl außer den stylesheet. Den Content zwischen <body>[....]</body> dann in eigene Seiten schreiben.

dommmxxx · 10. Juli 2014

Es hat leider nicht funktioniert
Die j[color=rgb(40,40,40)]avascript.php[/color] ist bei mir irgendwie nicht vorhanden, und wen ich es in den overall_footer schreib gehtâ€™s auch nicht ich hab auch schon den Header und Content open â€¦ getestet

[color=rgb(40,40,40)]Also ich geh noch einmal genauer ins Detail[/color]

Die fancybox Daten Ligen bei mir in den Ordnern

Code

/fancybox/lib
/fancybox/source

[color=rgb(40,40,40)]Dass was ich in die eigene Seite schreibe sieht wie folgt aus[/color]

Code

<a class="fancybox" href="#inline1" title="test">Inline</a>

	<div id="inline1" style="width:400px;display: none;">
		<h3>test</h3>

			hallo test

[color=rgb(40,40,40)]Nun muss ich irgendwo noch folgendes eintragen[/color]

Code

<head>


<script type="text/javascript" src="fancybox/lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="fancybox/source/jquery.fancybox.css?v=2.1.5" media="screen" />


<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>
</head>

Alles anzeigen

celltek · 10. Juli 2014

Dann erstell unter /themes/DEINTHEME/ eine javascript.php

PHP

<?php
if (preg_match("/javascript.php/i", $_SERVER['PHP_SELF'])) { 
    Header("Location: ../index.php");
	die();
}
?>


<script type="text/javascript" src="fancybox/lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="fancybox/source/jquery.fancybox.css?v=2.1.5" media="screen" />
 
<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>

Alles anzeigen

dommmxxx · 10. Juli 2014

Nun funktioniert schon mal die jquery.fancybox.css

Aber die fancybox geht immer noch nicht. Es passiert einfach nichts der URL ändert sich zwar auf #inline1 und wen ich
display: none;
raus nehme funktioniert auch die Sprung Marke,

es muss ja an js Ligen.

So langsam bin ich überfragt :unsure:

celltek · 10. Juli 2014

Hast du zufällig ein Link zu der eigenen Seite?

dommmxxx · 10. Juli 2014

Aber klar

https://www.highend-sponsoring…e=sections&op=view&ids=20

und hier mal das Test html Dokument

https://www.highend-sponsoring.de/test.html

celltek · 10. Juli 2014

Also was mir auffällt ist das du zwei mal jQuery lädst und deine style.css auch zwei mal lädst, bearbeite die overall_header.tpl und javascript.php datei.

scripte.JPG

Wichtig ist auch alle stylesheet's in javascript.php zu schreiben und nicht außerhalb von <head></head>

dommmxxx · 11. Juli 2014

ich habe nun nur eine [color=rgb(40,40,40)]jQuery[/color] Datei ladenlassen und aus der [color=rgb(40,40,40)]overall_header.tpl [/color]die css und js Dateien ausgeklammert
die style css Dateien sind soweit ich das sehe verschiedene, nun wird eigentlich alles aus der [color=rgb(40,40,40)]javascript.php[/color] geladen der Inhalt der Datei lautet wie folgt

PHP

<?php
if (preg_match("/javascript.php/i", $_SERVER['PHP_SELF'])) { 
    Header("Location: ../index.php");
	die();
}
?>
<head>
	<script type="text/javascript" src="fancybox/lib/jquery-1.10.1.min.js"></script>
	<script type="text/javascript" src="fancybox/source/jquery.fancybox.js?v=2.1.5"></script>
	<link rel="stylesheet" type="text/css" href="fancybox/source/jquery.fancybox.css?v=2.1.5" media="screen" />
	<link rel="stylesheet" type="text/css" href="fancybox/source/style.css" media="screen" />


	
	<link rel="stylesheet" href="themes/highend/css/style.css" type="text/css" media="screen" />
          <link rel="stylesheet" href="themes/highend/css/slide.css" type="text/css" media="screen" />
        <link rel="stylesheet" href="themes/highend/css/styletable.css" type="text/css" media="screen" />

        <script src="themes/highend/js/slide.js" type="text/javascript"></script>
        <script src="themes/highend/js/tricker.js" type="text/javascript"></script>


	<script type="text/javascript">
		$(document).ready(function() {


			$('.fancybox').fancybox();
		});
	</script>
</head>

Alles anzeigen

celltek · 11. Juli 2014

Das mit dem head head hast du bissel falsch verstanden nun hast du head doppelt Das brauchst du nicht in die javascript.php schreiben.
Soweit ist aber alles richtig nun.

dommmxxx · 11. Juli 2014

Das hab ich auch bemerkt hab auch den Fehler gefunden. Und zwar war noch mal weiter unten jquery von Google drin das habe ich jetzt raus genommen und nun gehtâ€™s.
Also vielen vielen dank für die schnelle und kompetente Hilfe

celltek · 11. Juli 2014

Kein Problem Ziel erreicht

GigantWebHost · 11. Juli 2014

Gib die Pfade mal absolut an also mit http://www.deineseite/...
Der Editor hat da sonst irgendwie probleme mit

celltek · 12. Juli 2014

Solange er baseURL gesetzt hat braucht mein kein direkten Pfad angeben.

In meta.php eintragen:

Code

<base href="http://deineurl.de">


oder auch möglich mit WWW:
<base href="http://www.deineurl.de">


wenn die Dateien immer mit HTTPS nur aufrufbar sein sollen dann:
<base href="https://deineurl.de">

Teilen