section | WP-support-blog.com https://wp-support-blog.com Hilfestellung, Tipps & Erfahrungen rund um WordPress Wed, 17 Nov 2021 14:47:37 +0000 de hourly 1 https://wordpress.org/?v=6.9.4 https://wp-support-blog.com/wp-content/uploads/2019/08/cropped-WP-Support-Blog-Flavicon-NEW-2-32x32.png section | WP-support-blog.com https://wp-support-blog.com 32 32 Elementor Abschnitt als Butten anlegen. https://wp-support-blog.com/elementor-abschnitt-als-butten-anlegen/?utm_source=rss&utm_medium=rss&utm_campaign=elementor-abschnitt-als-butten-anlegen https://wp-support-blog.com/elementor-abschnitt-als-butten-anlegen/#respond Sat, 26 Oct 2019 04:40:55 +0000 https://wp-support-blog.com/?p=517 Wie man einen Abschnitt/Spalte anklickbar macht und mit einen Link verknüpft. Schritt für Schritt einfach erklärt.

The post Elementor Abschnitt als Butten anlegen. first appeared on WP-support-blog.com.]]>
Wie man einen Abschnitt/Spalte anklickbar macht und mit einen Link verknüpft. Schritt für Schritt einfach erklärt.
  • Problem

Man möchte einen ganzen Abschnitt oder eine Spalte als Button anklickbar machen und mit einem Link versehen, findet die Funktion in Elementor leider nicht. 

  • Lösung

Installiere folgendes Plugin: https://wordpress.org/plugins/make-column-clickable-elementor/

Die Spalten erhalten dadurch eine neue Funktion „Column Link“

Die  Schritt für Schritt Anleitung funktioniert mit der aktuellen Version von Elementor nicht mehr.

Mittels CSS  und Javascript die Funktion selbst bauen. 

  • STEP BY STEP

Schritt 1.

CSS ID und Klassen vergeben.

Als erstes unter Erweitert bei der CSS ID und der CSS Klasse einen einmaligen Name vergeben (Beide den gleichen)  

Schitt 2.

HTML Widget Platzieren und Code einfügen.

in diesen Schritt müssen wir das HTML Widget in den Abschnitt oder die Spalte ziehen um die es geht und folgenden Code einfügen:


<script>
document.getElementById(„click1“).onclick = function() {myFunction()};

function myFunction() {
window.open(„https://wp-support-blog.com“, „_blank“);
}
</script>

Ersetze „click1“ durch deine einmalige CSS ID ersetzen und die URL auch ändern.

Schitt 3.

Eigenes CSS einfügen

Zum Schluss wollen wir noch, dass der Mauszeiger zur Hand wird, wenn wir über den Abschnitt fahren. dafür noch folgenden Code unter Eigene CSS des Abschnitts einfügen und click1 wieder durch deine CSS ID ersetzten.

.click1

{cursor:pointer;}

  • Fertig

Ich hoffe, ich konnte Dir mit diesem Post weiterhelfen.
Lass gerne Feedback oder ne Frage da.

The post Elementor Abschnitt als Butten anlegen. first appeared on WP-support-blog.com.]]> https://wp-support-blog.com/elementor-abschnitt-als-butten-anlegen/feed/ 0