Nicolas Lagios

Lead Developer & Intergrations Specialist

and

Nicolas Lagios

Lead Developer & Intergrations Specialist

and

Nicolas Lagios

Lead Developer & Intergrations Specialist

  and  

maxservicescanva
Κατηγορίες Blog

Προσθήκη κουμπιών δίπλα από τα οριζόντια tabs του Elementor

Κοινοποίηση σε facebook
Κοινοποίηση σε twitter
Κοινοποίηση σε pinterest
Κοινοποίηση σε linkedin
Κοινοποίηση σε reddit
Κοινοποίηση σε vk
Κοινοποίηση σε odnoklassniki
Κοινοποίηση σε tumblr
Κοινοποίηση σε digg
Κοινοποίηση σε skype
Κοινοποίηση σε stumbleupon
Κοινοποίηση σε mix
Κοινοποίηση σε telegram
Κοινοποίηση σε pocket
Κοινοποίηση σε xing
Κοινοποίηση σε whatsapp
Κοινοποίηση σε email

Γεια σας.

Με την βοήθεια της γλώσσας Javascript μπορείτε να προσθέσετε κουμπιά που οδηγούν σε άλλους συνδέσμους, δίπλα από τα tabs του Elementor, είτε στην αρχή, είτε στο τέλος, είτε ακόμα και ενδιάμεσα, κάτι που κάνει τα tabs να μοιάζουν σαν μενού ή μια μείξη τέλος πάντων horizontal tabs με μενού.

Αρχικά θα ορίσουμε δύο μεταβλητές, η 1η αφορά το να βρεις το υπάρχον Element μέσω css id και η δεύτερη αφορά το html περιεχόμενο που θέλουμε να εμφανιστεί πριν από το 1ο tab:

var idelementbefore = document.getElementById('ΕΔΩ ΤΟ ID'); //εάν θέλετε με κλάση αλλάξτε σε document.getElementsByClassName

var neokoumpi1 = 'HTML περιεχόμενο πχ κάποιο div περιεχόμενο';

 

Αμέσως μετά θα εκτελέσουμε τον ακόλουθο κώδικα:

idelementbefore.insertAdjacentHTML('beforebegin',neokoumpi1);

 

Η προαναφερόμενη συνάρτηση insertAdjacentHTML , παίρνει δύο ορίσματα, το 1ο όρισμα αφορά το που θέλουμε να μπει το καινούργιο HTML περιεχόμενο και το 2ο όρισμα αφορά το ποιο είναι το html περιεχόμενο.

Για το 1ο όρισμα, μπορείτε να χρησιμοποιήσετε τα ακόλουθα:

  • beforebegin -> Μπαίνει στην αρχή το νέο περιεχόμενο
  • afterend -> Μπαίνει στο τέλος (μετά το υπάρχον element με το id που δώσατε)

Υπάρχουν και άλλα options , αν ενδιαφέρεστε, απαντήστε εδώ και θα βοηθήσω.

 

Δείτε ένα ζωντανό παράδειγμα στο screenshot που ακολουθεί:

 

Καλή συνέχεια 😉

Δεν υπάρχουν σχόλια on Προσθήκη κουμπιών δίπλα από τα οριζόντια tabs του Elementor

Γράψτε ένα σχόλιο ή ερώτηση