Js σε header του WP

[killer76]

Καλησπέρα. Θέλω να φτιάξω έναν κώδικα JS που να εμφανίζει ενα copywrite μου σε 3 wp sites. 

Έφτιαξα ένα JS και το έχω στον host μου.

function openimage(){
        document.getElementById('myimage').src='https://www.mysite.gr/images/lg.png'
    }
function closeimage(){
        document.getElementById('myimage').src='https://www.mysite.gr/images/sm.png'
}
	document.addEventListener("DOMContentLoaded", function(){   
    var newelement = document.createElement("div");
    newelement.innerHTML = '<a href="https://www.mysite.gr" target="_blank" style="position:fixed;bottom: 30; left:10px"><img onmouseover="openimage()" onmouseout="closeimage()" id="myimage" height="30" src="https://www.mysite.gr/images/sm.png"></a>';
    document.body.appendChild(newelement);
});

Μετά δοκιμάζω σε ένα απλό .html να κάνω ενσωμάτωση το script στο head ή στο body και δουλεύει κανονικά όπως θέλω

<script  type="text/javascript" src="https://www.mysite.gr/js/myscript.js"></script>

Όταν όμως πάω να το εισάγω στο head του wordpress, ενώ βλέπω τον παραπάνω κώδικα στο source του site, δεν δουλεύει.

Επεξ/σία 18 Ιανουαρίου 2022 από killer76

[Predatorkill]

Η console του chrome βγαζει errors? Εισαι 100% σιγουρος οτι το path του js ειναι σωστο;

[killer76]

4 ώρες πριν, Predatorkill είπε

Η console του chrome βγαζει errors? Εισαι 100% σιγουρος οτι το path του js ειναι σωστο;

ναι το path είναι 1000% σωστό. Η κονσόλα δεν μου βγάζει error. Μου βγάζει error για κάτι άλλο σχετικά με fonts (θα το διορθώσω και αυτό)

Υ.Γ. Το έχω δοκιμάσει σε 2 wp sites. Επίσης δοκίμασα να βάλω και όλο τον κώδικα js αντί να το κάνω embed από εξωτερικό αρχείο. Και πάλι δεν εμφανίζει τίποτα

Υ.Γ. Δοκίμασα και σε custom site μου και πάλι δεν το εμφανίζει. Το εμφανίζει μόνο αν το βάλο σε ένα άδειο .html ή .php αρχείο

Επεξ/σία 18 Ιανουαρίου 2022 από killer76

[k33theod]

Για να βάλεις ένα js script σε ένα wp Θέλει μια συγκεκριμένη διαδικασία που περιγράφεται εδώ

https://developer.wordpress.org/themes/basics/including-css-javascript/

Λέει το εξής

πας στο αρχείο functions.php

κάνεις μια συνάρτηση στην οποία μέσα βάζεις εντολές

wp_enqueue_script() https://developer.wordpress.org/reference/functions/wp_enqueue_script/

και μετά καλείς τη συνάρτηση με την εντολή add_action( 'wp_enqueue_scripts', 'συναρτηση' );

Όλα αυτά καλά είναι να τα κάνεις σε child theme

[killer76]

15 ώρες πριν, k33theod είπε

Για να βάλεις ένα js script σε ένα wp Θέλει μια συγκεκριμένη διαδικασία που περιγράφεται εδώ

https://developer.wordpress.org/themes/basics/including-css-javascript/

Λέει το εξής

πας στο αρχείο functions.php

κάνεις μια συνάρτηση στην οποία μέσα βάζεις εντολές

wp_enqueue_script() https://developer.wordpress.org/reference/functions/wp_enqueue_script/

και μετά καλείς τη συνάρτηση με την εντολή add_action( 'wp_enqueue_scripts', 'συναρτηση' );

Όλα αυτά καλά είναι να τα κάνεις σε child theme

Το διάβασα αυτό και θα το δοκιμάσω, απλά νόμιζα οτι μπορώ και καρφωτά. Πχ γιατί όταν βάζω κώδικα google analytics το διαβάζει? Επίσης μια φορά που ήθελε να διαφημιστεί κάποιος στο site μου, ένα js κώδικα μου έστειλε να βάλω στο header, τον έβαλα και μετά εμφανιζόταν η διαφήμιση κανονικά.

EDIT: Παρότι εχθές που έκανα τις δοκιμές, καθάριζα και cache κλπ και δεν εμφανιζόταν. Ανοίγω σήμερα τα site και εμφανίστηκε κανονικά. Δεν μπορώ να καταλάβω τι έγινε? Τεσπα, όλα καλά. Ευχαριστώ πολύ!!!

Επεξ/σία 19 Ιανουαρίου 2022 από killer76

[killer76]

Για να μην ανοίγω νέο νήμα. Έφτιαξα τελικά αυτό που ήθελα παραπάνω. Όταν έβαλα το site στο gtmetrix ομως είδα οτί άλλα source πολύ μεγαλύτερα φορτώνουν σε πολυ μικρο χρονικό διαστημα ενώ το δικό μου είναι 666bytes (νουμερο ε? 😇) μου φορτώνει σε πολύ μεγαλύτερο χρόνο. Τι μπορεί να φταίει?

[k33theod]

θα πρέπει να συγκρίνεις ταχύτητες μεταφοράς αρχείων που σερβίρονται από τον ίδιο server. Αν το 57k το στέλνει ένας γρήγορος server μπορεί να σταλεί γρηγορότερα από ένα μικρότερο αρχείο που αποστέλλεται με αργό server.

Επεξ/σία 23 Ιανουαρίου 2022 από k33theod

[killer76]

Στις 23/1/2022 στις 5:01 ΜΜ, k33theod είπε

θα πρέπει να συγκρίνεις ταχύτητες μεταφοράς αρχείων που σερβίρονται από τον ίδιο server. Αν το 57k το στέλνει ένας γρήγορος server μπορεί να σταλεί γρηγορότερα από ένα μικρότερο αρχείο που αποστέλλεται με αργό server.

θα το κάνω αλλά γενικά είναι πολύ γρήγορα ο χώρος που σερβίρει το αρχείο.

Κάτι τελευταίο (Το υπόσχομαι  ), Υπάρχει τρόπος με ένα js (κάπως όπως το παραπάνω) που θα έχω στο δικό μου χώρο και θα το ενσωματώνω ως external js σε όποιο site θέλω εγώ, είτε wp είτε απλό html να δημιουργεί και να εμφανίζει ένα row λίγο πριν το footer? Σαν ένα απλό row (όχι fixed ή absolute κλπ) 

Δηλαδή τι θέλω να κάνω (γιατί το παραπάνω που είχα φτιάξει δεν μου άρεσε πολύ να φαίνεται σαν κουμπί) 

1. Θέλω να έχω στον δικό μου χώρο ένα js αρχείο που θα διαμορφώνω το content και το styling όπως θέλω εγώ...
2. Όταν λοιπόν το ενσωματώσω σε ένα header ή footer , σε οποιοδήποτε site μου, είτε wp είτε custom, κάτω από οτιδήποτε άλλο...
3. Να εμφανίζει ένα row (όχι fixed, θα εμφανίζεται μόνο αν κάποιος κάνει scroll στο τέλος), όπως την παρακάτω εικόνα.

 

 

 

[k33theod]

Λες πριν το footer αλλά στη εικόνα δείχνεις μετά το footer. Θα μου πεις έχει σημασία; Στην περίπτωση της εικόνας είναι πιο απλό γιατί κάνεις το element και το κάνεις append στο body οπότε πάει στο τέλος. Σαν κώδικας δηλαδή όπως παρακάτω

let body = document.querySelector('body');
let my_element = document.createElement('div')
body.appendChild(my_element);
//enoeitai oti prosarmozeis kai to style kai to content pou theleis

 

[killer76]

Στις 28/1/2022 στις 3:12 ΜΜ, k33theod είπε

Λες πριν το footer αλλά στη εικόνα δείχνεις μετά το footer. Θα μου πεις έχει σημασία; Στην περίπτωση της εικόνας είναι πιο απλό γιατί κάνεις το element και το κάνεις append στο body οπότε πάει στο τέλος. Σαν κώδικας δηλαδή όπως παρακάτω

let body = document.querySelector('body');
let my_element = document.createElement('div')
body.appendChild(my_element);
//enoeitai oti prosarmozeis kai to style kai to content pou theleis

 

Φίλε μου σε ευχαριστώ πολύ! δούλεψε!