kostenloser Webspace werbefrei: lima-city


js script in WP einbinden

lima-cityForumDie eigene HomepageHomepage Allgemein

  1. Autor dieses Themas

    turmfalken-nikolai

    Kostenloser Webspace von turmfalken-nikolai

    turmfalken-nikolai hat kostenlosen Webspace.

    Die Umgestaltung bzw. Neuerstellung meiner Homepage mit WP stellt mich vor neue Probleme.
    Auf meiner alten Seite ( erstellt mit CMS ZetaProducer ) hatte ich ein js script zur Anzeige meiner Kameras als Livestream eingebunden. Dies versuchte ich nun auch auf meiner neuen Seite. Bei meiner Suche in diversen Foren etc stieß ich auf mehrere Beschreibungen mittels folgender WP Plugins: Inline Javascript Plugin; iframe; HiFi;Header and Footer. Leider hat keine der Varianten zum gewünschten Erfolg geführt.
    Hat da jemand eine Lösung?

    Vielen Dank schon mal im Voraus!
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Hast du irgendwo noch dein altes Script zum drüberschauen?
    Javascript kannst du eigentlich so auch problemlos in Posts einfügen. Dafür schaltest du einfach den Editor von "visuell" auf Text um. Da kannst du dann selbst am HTML spielen.
  4. Autor dieses Themas

    turmfalken-nikolai

    Kostenloser Webspace von turmfalken-nikolai

    turmfalken-nikolai hat kostenlosen Webspace.

    das hab ich probiert.

    das hatte ich bereits probiert. Die Kamera.js liegt auch im entsprechenden Verzeichnis.
    Habe dann in WP eine Seite erstellt, bin in der Ansicht von "visuell" auf "Text" gewechselt und habe

    <script src="Kamera.js"></script>

    eingetragen. Hat leider nicht funktioniert.

    Dann habe ich es versucht mit dem einfügen von

    <script type="text/javascript" src="https://turmfalken-nikolai-spandau.de/assets/bundle.js?v=635893307662827091"></script>
    </head>
    <body id="metro-responsive">
    <style>
    #Bilderrahmen{
    position:absolute;
    width:600px;
    height:450px;
    }
    #Bedienung{
    position:absolute;
    z-index:2;
    }
    #Bedienung input{
    background-color:black;
    color:white;
    }
    .Normal{
    position:absolute;
    }
    .Vollbild{
    left:0px;
    top:0px;
    }
    </style>
    <script>
    Fullscreen=false;
    Kanal=1;
    function LoadImage(){
    //Aktualisiert das angezeigte Bild
    document.images.jpgviewer.src = "http://timi17.ddns3-instar.de:8082/video.jpg?ch="+Kanal+"&uniq="+Math.random();
    }
    function SetMyTimer(){
    //Lädt das nächste Bild nach einer bestimmten Zeit
    window.setTimeout("LoadImage();", 30);
    }
    function ToggleSize(){
    //Ändert die Größe des angezeigten Bilds
    if (Fullscreen){ //Befindet sich das Bild im Vollbildmodus?
    //Vollbildmodus, also Größe zurücksetzen
    document.getElementById("Bilderrahmen").style.width="600px";
    document.getElementById("Bilderrahmen").style.height="450px";
    document.getElementById("Bilderrahmen").style.left="auto";
    document.getElementById("Bilderrahmen").style.top="auto";
    document.getElementById("Bedienung").style.position="absolute";
    document.getElementById("Bedienung").style.left="auto";
    document.getElementById("Bedienung").style.top="auto";
    Fullscreen=false;//Kein Vollbildmodus mehr
    }else{
    //Kein Vollbildmodus, also Größe auf Bildschirmgröße anpassen
    Height=window.innerHeight;//Höhe auslesen
    Width=window.innerWidth;//Breite auslesen
    if (Height/480<Width/640){//Beschränkt die Breite oder die Höhe die Größe?
    Width=Height*640/480;
    }else{
    Height=Width*480/640;
    }
    document.getElementById("Bilderrahmen").style.width=Width+"px";
    document.getElementById("Bilderrahmen").style.height=Height+"px";
    document.getElementById("Bilderrahmen").style.top=0;
    document.getElementById("Bilderrahmen").style.left=(window.innerWidth-Width)/2+"px";
    document.getElementById("Bedienung").style.position="fixed";
    document.getElementById("Bedienung").style.left=(window.innerWidth-Width)/2+"px";
    document.getElementById("Bedienung").style.top=0;
    Fullscreen=true;//Nun im Vollbildmodus
    }
    }
    function Wechsel(Kanalnummer){
    Kanal=Kanalnummer;
    LoadImage();//Aktualisiert sofort
    }
    </script>



    Der Ordner "assets" liegt natürlich auch im entsprechenden Verzeichnis auf dem Webspace.

    Leider führte auch das nicht zum Erfolg.

    Im alten CMS ZetaProducer konnte ich das problemlos in die html Datei der Seite einfügen wo die Kamera s zu sehen sein sollten. In WP bekomm ich das nicht eingebaut.

    Beitrag zuletzt geändert: 18.1.2017 2:37:42 von turmfalken-nikolai
  5. Du nutzt ja URL-Rewriting bei dir. Wenn du nun also kamera.js laden lassen willst und die URL ist https://turmfalken-nikolai-spandau.de/falkencams/, dann sucht der Browser nach https://turmfalken-nikolai-spandau.de/falkencams/kamera.js
    Probiere mal "/kamera.js".
  6. Autor dieses Themas

    turmfalken-nikolai

    Kostenloser Webspace von turmfalken-nikolai

    turmfalken-nikolai hat kostenlosen Webspace.

    hm, das ist halt wieder das Problem das ich davon null Ahnung hab. Im vorigen Jahr war ein User hier so nett und hat mir das Script geschrieben. Wo find ich das? Wo muß ich das ändern? :confused:
    Kann ich auch insofern nicht nachvollziehen da es auf meinem Webspace nie einen Ordner https://turmfalken-nikolai-spandau.de/falkencams/ gab. Die Kamera.js lag immer im Ordner default-website und ist nun auf Grund der WP Installation und Nutzung in den WP Ordner verschoben

    Beitrag zuletzt geändert: 18.1.2017 3:01:38 von turmfalken-nikolai
  7. Den Ordner "falkencams" gibt es so auch nicht. Durch die .htaccess wird jeder Aufruf auf die index.php von Wordpress weitergeleitet (Ausnahme: Wirklich existierende Dateien). Der PHP-Code schaut dann noch ob zu der Adresse eine Seite oder ein Blogpost existiert.
    Wie war denn das früher?
    Falls das Template Unterseiten anzeigen kann:
    Ich könnte dir auch auf die Schnelle ein Plugin bauen, was dir eine Cam deiner Wahl anzeigt. Kannst du dann über einen "Shortcode" (Z.B. [webcam url="...." refresh="500"]) in jedem Blogpost oder auf jeder Seite anzeigen. Damit könntest du z.B Unterseiten für deine Cams anlegen und ggf. neue einbinden. Einziger Nachteil: Die Seite lädt halt beim Webcamwechsel neu.
  8. Autor dieses Themas

    turmfalken-nikolai

    Kostenloser Webspace von turmfalken-nikolai

    turmfalken-nikolai hat kostenlosen Webspace.

    Nach langem Suchen habe ich nun im WP Hilfeforum meine Frage auch noch mal gestellt und einen Tip bekommen. Den habe ich nun umgesetzt und tatsächlich das Script in die Seite reinbekommen. Allerdings stimmt nun das Layout nicht mehr. Im unteren Bereich jeder Seite gibts ja diese "Fußzeile" oder wie auch immer sich das nennt:
    Stolz präsentiert von WordPress. Theme: Flat 1.0.3 by Themeisle.


    Diese wird nun von meinem Kamerafenster überdeckt. Bei Doppelklick in das Kamerafenster soll sich dieses vergrößern. Tut es auch aber ein Teil des Fensters ist dann rechts nicht mehr sichtbar.

    URL gelöscht da nur Testseite! Ergebnis ist hier nach Lösung des Problems:
    https://turmfalken-nikolai-spandau.de/falkencams/


    EDIT Problem ist gelöst was das Design angeht! Dann kann ich mich nun den Konfigurationen der Kameras widmen!

    Danke an alle die geholfen haben!:wave:

    Beitrag zuletzt geändert: 18.1.2017 18:43:20 von turmfalken-nikolai
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!