Change Document Title
robots nofollow
Jimdo-Specials
Caption-Slider
CaptionContainer für freie Beschriftungen für die Jimdo-Standard-Hintergrund-Wechselbildgalerie.
- Captions bzw. Beschriftungen aus Jimdo-Standardelementen erstellen mit voller Jimdo-Funktionalität
- Gruppierung mehrerer Elemente in einem Spaltenelement möglich
- frei positionierbar über dem Hintergrund-Slider (CSS)
- Verknüpfungen über die gesamte Fläche des .jqbga-containers möglich, oder
- ...mit Standard-Verknüpfungen innerhalb des CaptionContainers
...ich liebe die deutshe Sprache (JimdoStandardHintergrundWechselbildgalerie) und vielen Dank an Sebastian Künzl für seine Hilfe!
HowToDo
- Im Bearbeitungsmodus CaptionContentContainer erstellen (Standard Spaltenelement, einspaltig) und
- ggf. html-Widget für Verlinkung einsetzen (class="caption_link" (...erstellt fullsize-Verlinkung über das gesamte Hintergrundbild)
- Auslöser (Trigger) für CaptionContentContainer (html-Widget-Element) direkt unter das Spaltenelement setzen (...)
Detail:
Bei Interesse an den erforderlichen Skripten für die Caption-Slider-Programmierung
bitte eine Nachricht über das unten stehende Kontaktformular schicken!
WhatsApp-Button in Navigation
Verschiedene Methoden, einen WhatsApp-Chat-Button auf eine Jimdo Seite zu setzen (...ohne Widget)
Methode 1:
...verlinktes Bildelement (CSS-formatiert)
Methode 2:
...verlinkter Button
WhatsApp-Link:
https://api.whatsapp.com/send/?phone=491773847069&text&type=phone_number&app_absent=0
rot = WhatsApp Empfänger-Nummer
Positionierung/Darstellung:
...die Verankerung des WhatsApp Buttons in der Navigation wird über ein jQuery-Skript festgelegt:
<script type="text/javascript">
$(document).ready(function() {
$('#cc-m-12345678 a').clone().appendTo('.jtpl-navigation');
});
</script>
(...vorher jQuery einbinden in Menü > Einstellungen head-Bereich bearbeiten > gesamte Webseite/Unterseite)
...die Formatierung des Buttons (Farben, Verhalten, Cursor etc.) übernimmt ein CSS-Skript
Aktion:
...der Link öffnet die WhatsApp-Internetseite mit dem Download-Link für das WhatsApp Programm für Windows/Mac in einem neuen Fenster und/oder direkt die App, wenn diese bereits auf dem Endgerät eingerichtet ist:
WhatsApp-Skripte
Die gleiche Methode kann auch für einen Telefon-Button in der Navigation benutzt werden. Hier muss nur der Link anders aussehen:
- https://wiki.selfhtml.org/wiki/HTML/Tutorials/Links/klickbare_Telefonnummern
Hierfür muss man sich allerdings das Bildelement in ein Textelement kopieren, dieses verlinken und dann die Linkadresse im html-Modus anpassen.
TextWithImage-Wrapper
Umformatieren des Jimdo Bild+Text Elementes per CSS
WebP-Upload still can't be done!
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
create textWithImage-wrapper
css für textWithImage-wrapper
Changing Links & Attribs
- https://stackoverflow.com/questions/40287828/changing-robot-meta-tags-with-javascript-and-jquery
- https://www.tutorialrepublic.com/faq/how-to-change-href-attribute-of-a-hyperlink-using-jquery.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Set HREF for Anchor Tag</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script> $(document).ready(function(){
$('a[href^="http://"]').each(function(){
var oldUrl = $(this).attr("href"); // Get current url
var newUrl = oldUrl.replace("http://", "https://"); // Create new url
$(this).attr("href", newUrl); // Set herf value });
});
</script>
</head>
<body>
<p>
<a href="http://www.google.com">Google</a>
</p>
<p>
<a href="http://www.gmail.com">Gmail</a>
</p>
</body>
</html>
Caption-Content-Bereich
Caption 1
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
caption_link
upper element create_ImageCaptionContent
Caption 2
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
caption_link
upper element create_ImageCaptionContent
Caption 3
Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
caption_link
upper element create_ImageCaptionContent