Shortcode-Ultimate

Spoiler-Shortcode

https://getshortcodes.com/docs/accordion/

Wenn der Spoiler geöffnet sein soll, dann
open=“yes“
dem Code hinzufügen

Falls mehrere Spoiler hinzugefügt werden sollen, dann nur mehrmals einfügen.

Spoiler – Titel anpassen

im Code des Spoilers hinzufügen
class="my-custom-spoiler"

Schwebezustand [Farben anpassen]

bei Shortcodes / Einstellungen / individuelles CSS einfügen

.su-spoiler.my-custom-spoiler > .su-spoiler-title:hover {

/* Text Size */
font-size: 21px;

/* Background Color */
background: #ff00ff;

/* Text Color */
color: #ffffff;

}

Spoiler-Symbol
.su-spoiler.my-custom-spoiler > .su-spoiler-title > .su-spoiler-icon {

/* Icon Color */
color: #00ff00;

}

Spoiler-Inhalt

.su-spoiler.my-custom-spoiler > .su-spoiler-content {

/* Text Size */
font-size: 21px;

/* Background Color */
background: #ffff00;

/* Text Color */
color: #000000;

}

Content-Slider-Shortcode

https://getshortcodes.com/docs/content-slider/

Den Slidern nur den Text ändern



Ich bin Slider eins mit dem Text



Ich bin Slider zwei mit dem Text Teil 2



Ich bin Slider drei mit dem Text Teil 3



Tool-Tip - Shortcode

https://getshortcodes.com/docs/tooltip/

Bewegen Sie den Mauszeiger über mich, um den Tooltip zu öffnen

Symbole / Icon - Shortcode

https://getshortcodes.com/docs/icon/

Dies ist ein benutzerdefiniertes Symbol
Archive.zip herunterladen [5 MB]
Benötigen Sie Unterstützung? Rufen Sie uns an!

Paneel nebeneinander-Shortcode

https://getshortcodes.com/docs/panel/

Inhalt Teil Eins
Teil Zwei-Inhalt
Der Dritte Inhalt

Paneel mit Grafik-Shortcode

https://getshortcodes.com/docs/icon-panel/

Panel-Inhalt
Panel-Inhalt
Panel-Inhalt

Text mit Symbol / Icon -Shortcode

https://getshortcodes.com/docs/text-with-icon/

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius nibh leo, sit amet mollis sem gravida vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

color=“#eeeeee“
icon_color=“#eeeeee“
icon_size=“von 10 bis 320″
icon=“icon: star“ – Star ändern z.B. heart

Fortschrittsbalken-Shortcode

https://getshortcodes.com/docs/progress-bar/

Photoshop

PHP

WordPress

style=““ – default (Default), fancy (Fancy), thin (Thin)
bar_color=“#eeeeee“
text_color=“#eeeeee“

Fortschrittsbalken Teil 2 - Shortcode

https://getshortcodes.com/docs/progress-pie/


75%

$9

Hallo!


Parallax-Shortcode

https://getshortcodes.com/docs/parallax-section/

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tincidunt elit et eros commodo, laoreet iaculis risus lobortis. Ut eget cursus nisi. Maecenas egestas, nunc gravida rutrum porttitor, ante ligula luctus erat, non vehicula massa mauris et ante. Mauris a vulputate sapien. Aenean sagittis tellus vitae mi viverra, sed venenatis nibh fringilla. Suspendisse vel suscipit elit, vel ultricies sem. Suspendisse elementum risus ut efficitur feugiat.

background=“#eeeeee“
background_position=““ – left top (Left Top), center top (Center Top), right top (Right Top), left center (Left Center), center center (Center Center), right center (Right Center), left bottom (Left Bottom), center bottom (Center Bottom), right bottom (Right Bottom)
fullwidth=““ Yes oder No
parallax=““ Yes oder No
border=“1px solid #cccccc“

Zitat mit Name & Bild-Shortcode

https://getshortcodes.com/docs/testimonial/

Dies ist mal ein Zitat aus meinem Mund, welches hier angezeigt wird. Das kann man natürlich beliebig lang gestalten.
silral, Dynamofanseite
silral

Zitat mit Link - Shortcode

https://getshortcodes.com/docs/quote/

Alles sollte so einfach wie möglich gemacht werden, aber nicht einfacher…​Albert Einstein

Schatten-Shortcode

https://getshortcodes.com/docs/shadow/

Dies ist der Box-Titel
Dies ist ein Beispieltext, der beliebig erweitert werden kann.

Hier der Inhalt

Lightbox-Shortcode

https://getshortcodes.com/docs/lightbox/

Klicken Sie hier, um die Lightbox mit einem Bild zu öffnen

Description

Shortcodes su_lightbox and su_lightbox_content are used to display various elements in a pop-up window. You can display an image, a web page, or any HTML content.

Options

There are two main parameters defining the functioning of lightbox,  type and src.

type parameter specifies the contents type and can have the following values:

  • image – for images;
  • iframe – for display of web pages in the lightbox window;
  • inline – for display of any HTML content.

src parameter defines the contents. This parameter may have the following values:

  • URL – for display of images or web pages in the lightbox window. Examples: http://example.com/image.jpg (image), http://example.com (web page);
  • CSS selector – for display of any HTML contents. Example: #contact-form.

YouTube Video einbetten - Shortcode

https://getshortcodes.com/docs/youtube/

Normales Video


Google-Maps - Shortcode

https://getshortcodes.com/docs/google-maps/


Pull-Quote - Shortcode

https://getshortcodes.com/docs/pullquote/

Ich bin das Zitat.
Und das hier ist ein Beispieltext, welcher beliebig erweitert werden kann. Ich bin Dynamo Fan! Du kannst dich über mich lustig machen, mich foltern oder mich umbringen. Aber ändern kannst du es nicht! Wir haben einen Traum (auch wenn er nicht gleich wahr wird) Aber! Einmal Dynamo – immer Dynamo, Vier Punkte Abzug – Na, und?

Notiz / Text mit farblichen Hintergrund - Shortcode

https://getshortcodes.com/docs/note/

Integer cursus orci bibendum sem mollis, et bibendum diam sodales. Pellentesque eu suscipit magna, sed faucibus sem. Maecenas lacinia nulla vel risus molestie, in bibendum turpis congue.

Text erweitern beim Mouseklick - Shortcode

https://getshortcodes.com/docs/expand/

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pharetra scelerisque urna, non posuere urna fringilla vel. Sed lorem lacus, Lobortis a risus sed, Gravida sodales mauris.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Mehr anzeigen
Weniger anzeigen

Tabs Drei Beispiele - Shortcode

https://getshortcodes.com/docs/tabs/

Tab-NameTab-NameTab-Name
Tab-Inhalt
Tab-Inhalt
Tab-Inhalt

Tab-NameTab-NameTab-Name
Tab-Inhalt
Tab-Inhalt
Tab-Inhalt

Tab-NameTab-NameTab-Name
Tab-Inhalt
Tab-Inhalt
Tab-Inhalt

RSS Feed - Shortcode

https://getshortcodes.com/docs/rss-feed/

Neueste Beiträge von smashingmagazine.com


CSV Tabelle - Shortcode

https://getshortcodes.com/docs/csv-table/

Die ist nur zum Veranschauen


  1. Viele weitere Shortcodes sind hier zu finden
  2. Shortcodes (z.B. Spoiler die Farben) ändern/anpassen
  3. Shortcodes (z. B. Tabs Farben) ändern/anpassen