{"id":241031,"date":"2022-04-03T16:59:00","date_gmt":"2022-04-03T13:59:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=241031"},"modified":"2022-05-16T11:31:37","modified_gmt":"2022-05-16T08:31:37","slug":"der-einfachste-weg-javascript-zu-ihrer-wordpress-site-hinzuzufugen","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/de\/der-einfachste-weg-javascript-zu-ihrer-wordpress-site-hinzuzufugen\/","title":{"rendered":"Der einfachste Weg, Javascript zu Ihrer WordPress-Site hinzuzuf\u00fcgen"},"content":{"rendered":"

Ich bin froh, dass du hier bist.<\/p>\n

Wenn Sie kein erfahrener WordPress-Entwickler sind, kann das Hinzuf\u00fcgen von Javascript zu Ihrer Website ziemlich einsch\u00fcchternd sein. Noch schlimmer\u2026<\/p>\n

Sie k\u00f6nnten Ihre Website ernsthaft durcheinander bringen, wenn Sie nicht aufpassen.<\/p>\n

In diesem Tutorial erfahren Sie, wie Sie Ihrer WordPress-Site am schnellsten und sichersten Javascript hinzuf\u00fcgen.<\/p>\n

Neues Javascript zu WordPress hinzuf\u00fcgen<\/h2>\n

Normalerweise w\u00fcrden Sie ein Child-Theme<\/a> oder ein untergeordnetes Plugin hinzuf\u00fcgen, das dann eine neue Javascript-Datei auf Ihre Site l\u00e4dt.<\/p>\n

Dies ist jedoch eine Menge Arbeit, wenn Sie nur ein oder zwei Snippets von JS-Code hinzuf\u00fcgen m\u00fcssen. Die einfachste L\u00f6sung ist die Verwendung des Simple Custom CSS- und JS-<\/a> Plugins.<\/p>\n

\"Der<\/a><\/p>\n

Installieren und aktivieren Sie dieses Plugin auf Ihrer Website, und Sie sehen ein neues Men\u00fcelement f\u00fcr benutzerdefiniertes CSS und JS, das Ihrem Dashboard hinzugef\u00fcgt wurde. Bewegen Sie den Mauszeiger \u00fcber das neue Men\u00fcelement und klicken Sie auf die Option "Benutzerdefiniertes JS hinzuf\u00fcgen", um mit dem Hinzuf\u00fcgen Ihres Javascripts zu beginnen.<\/p>\n

\"Der<\/a><\/p>\n

Javascript hinzuf\u00fcgen<\/h3>\n

Auf der n\u00e4chsten Seite sehen Sie einen Code-Editor, in den Sie das JS eingeben k\u00f6nnen, das Sie Ihrer Site hinzuf\u00fcgen m\u00f6chten.<\/p>\n

\"Der<\/a><\/p>\n

Auch die Kommentare im Editor sind sehr hilfreich<\/p>\n

Geben Sie Ihrem JS einen Titel, damit Sie sich leicht merken k\u00f6nnen, warum Sie es hinzugef\u00fcgt haben, und geben Sie dann Ihren Code in den unten stehenden Editor ein. Stellen Sie sicher, dass Sie zuerst die Kommentare l\u00f6schen, da diese nicht zu Ihrer Website hinzugef\u00fcgt werden m\u00fcssen.<\/p>\n

Testen Sie das Javascript<\/h3>\n

Wenn Sie sicherstellen m\u00f6chten, dass es funktioniert, k\u00f6nnen Sie dieses JS zu Ihrer Site hinzuf\u00fcgen:<\/p>\n

jQuery(document).ready(function( $ ){\n    $('.logged-in').on('click', function(){\n        alert('The code is working!'); \n    });\n});<\/code><\/pre>\n
So sieht es im Editor aus.<\/p>\n
\"Der<\/a><\/p>\n
Dieser Code zeigt lediglich ein Warnfeld an, wenn Sie auf eine beliebige Stelle auf der Website klicken, wie folgt:<\/p>\n
\"Der<\/a><\/p>\n
Es betrifft nur angemeldete Benutzer, sodass Ihre Besucher nicht gest\u00f6rt werden, wenn Sie es zu einem Test hinzuf\u00fcgen.<\/p>\n
Sobald Sie sicher sind, dass es funktioniert, k\u00f6nnen Sie das Test-Snippet gegen das echte JS austauschen, das Sie Ihrer Site hinzuf\u00fcgen m\u00f6chten.<\/p>\n
Konfigurieren Sie die JS-Optionen<\/h3>\n
Simple Custom CSS & JS bietet einige praktische Optionen, um genau zu entscheiden, wie Ihr Javascript zur Site hinzugef\u00fcgt wird.<\/p>\n
\"Der<\/a><\/p>\n
Erstens, wenn Sie nur ein wenig Code hinzuf\u00fcgen, behalten Sie den Linking-Typ als "Intern" bei, wodurch der Code einfach zur Seite hinzugef\u00fcgt wird. Dies ist einfacher als das Laden einer anderen Datei und wirkt sich nicht auf die Ladezeit Ihrer Website aus.<\/p>\n
Wenn Sie als N\u00e4chstes ein Analyseskript hinzuf\u00fcgen, werden sie wahrscheinlich sagen, ob Sie es der Kopf- oder Fu\u00dfzeile hinzuf\u00fcgen sollten. Andernfalls ist es am besten, standardm\u00e4\u00dfig die Fu\u00dfzeile zu verwenden.<\/p>\n
Wenn das Javascript Ihre Besucher beeinflussen soll, lassen Sie die Option "Im Frontend" f\u00fcr die Einstellung "Wo in der Site" aktiviert. Die Option \u201eIn Admin“ ist nur f\u00fcr den Fall, dass Sie das Javascript laden m\u00f6chten, w\u00e4hrend Sie Seiten im WP-Dashboard anzeigen, und die Option \u201eAuf der Anmeldeseite“ ist nat\u00fcrlich nur f\u00fcr die Mitglieds-Anmeldeseite.<\/p>\n
Abschluss<\/h2>\n
Dieser Ansatz ist VIEL einfacher als das Erstellen eines neuen Plugins oder Child-Themes.<\/p>\n
Ganz zu schweigen davon, dass Simple Custom CSS & JS ein gro\u00dfartiges Plugin ist, und Sie werden wahrscheinlich in Zukunft mehr Verwendung daf\u00fcr finden. Es gibt auch eine Pro-Version, die einige ziemlich beeindruckende Anpassungen erm\u00f6glicht, wenn Sie mehr Flexibilit\u00e4t ben\u00f6tigen.<\/p>\n
Wenn Sie Fragen oder Feedback zu diesem Beitrag haben, hinterlassen Sie unten einen Kommentar.<\/p>\n
Aufnahmequelle:  www.competethemes.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Mach deine Seite nicht kaputt! Folgen Sie diesem einfachen Tutorial, um den einfachsten und sichersten Weg zu lernen, Javascript zu Ihrer WordPress-Site hinzuzuf\u00fcgen.<\/p>\n","protected":false},"author":1,"featured_media":21627,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[567],"tags":[845],"class_list":["post-241031","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-grundlagen","tag-affiai-de"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/241031","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/comments?post=241031"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/241031\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media\/21627"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media?parent=241031"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/categories?post=241031"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/tags?post=241031"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}