Ausgabe 2024
Stockholm
01 STOCKHOLM CSS-CODE
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de
STOCKHOLM 7
all size rules */
/* big screen + ipad pro landscape */
@media only screen and (min-width: 1281px) {
.jtpl-content__inner {
max-width: 1280px!important;
padding: 40px 10px!important;
}
.jtpl-footer {
max-width: 1280px!important;
}
}
/* laptops + small screens */
@media only screen and (max-width: 1280px) {
}
/* small tablets */
@media only screen and (max-width: 1024px) {
}
/* mobiles */
@media only screen and (max-width: 767px) {
}
/*]]>*/
</style>
EXTRA-CODE STOCKHOLM: Alle Bilder im Vollformat wie Startseite
<style type="text/css">
/*<![CDATA[*/
.jtpl-header {height: 95vh!important; height: calc(100vh -
50px)!important;}
/*]]>*/
</style>
02 Mobile Vergrößerung des Hintergrundbereiches
02 STOCKHOLM MOBIL CSS-CODE
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
/* STOCKHOLM 6.2 */
/* mobiles */
@media only screen and (max-width: 767px)
{
.jtpl-header {min-height: 369px!important;}
}
/*]]>*/
</style>
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Abstände im Bearbeiten-Modus markieren
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
.cc-m-all.cc-m-spacing .cc-m-spacer {
background-color: gray;
background-image: repeating-linear-gradient(45deg, transparent,
transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5)
70px);
}
/*]]>*/
</style>
Codes im Bearbeiten-Modus markieren
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
div.cc-m-all.cc-m-htmlcode div.cc-m-all-content {
overflow: hidden !important;
background-color: #0098db!important;
background-image: repeating-linear-gradient(45deg, transparent,
transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5)
70px);
}
/*]]>*/
</style>
Kingsize Navigations-Bearbeitung
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
#cc-nav #cc-nav-box-container {
width: 800px!important;
}
#cc-nav #cc-nav-box-container .cc-nav-page input {
width: 600px!important;
font-weight: 600!important;
font-size: 14px !important;
}
#cc-nav #cc-nav-box-container #cc-nav-footer.cc-nav-footer-fixed,
#cc-nav #cc-nav-box-container #cc-nav-footer.cc-nav-footer-top {
width: 814px!important;
}
#cc-nav #cc-nav-box-container .cc-nav-page.cc-nav-hidden {
background-color: #333!important;
}
#cc-nav #cc-nav-box-container .cc-nav-page.cc-nav-hidden .cc-nav�title {
color: #0098db!important;
}
#cc-nav #cc-nav-box-container .cc-nav-page {
background-color: #0098db!important;
padding: 4px!important;
}
#cc-nav #cc-nav-box-container .cc-nav-page .cc-nav-page-icons a {
opacity: 0.45!important;
}
/*]]>*/
</style>
Jimdo-Lightbox in Weiß
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
#jquery-overlay,
.pswp__bg {
background: #fff!important;
}
.pswp__ui--fit .pswp__top-bar,
.pswp__ui--fit .pswp__caption {
background-color: rgba(255,255,255, 1.0) !important;
}
.pswp__counter,
.pswp__button--custom,
.pswp--zoom-allowed,
.pswp__button--zoom,
.pswp__button--close,
.pswp__button--fs {
color: #fff!important;
}
.pswp__counter,
.pswp__button,
.pswp__button--arrow--left::before,
.pswp__button--arrow--right::before {
background-color: #ccc !important;
}
/*]]>*/
</style>
Pflegbarer Text im Bild
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
@media (min-width: 767px) {
.content-options-inner .j-imageSubtitle figcaption,
.content-options-inner .j-textWithImage figcaption,
.cc-catalog-container-new .cc-catalog-galleryview .cc-webview�product,
.cc-imagewrapper figcaption {
width: auto!important;
background-color: rgba(0,0,0,0.7);
color: #fff;
bottom: 0px!important;
position: absolute!important;
padding: 10px!important;
}
}
/*]]>*/
</style>
Große Selectbox für Shopvarianten
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
select.cc-product-variant-selectbox {
font-size: 1.4em !important;
margin-top: 15px !important;
}
/*]]>*/
</style>
Feldhinweise ausblenden
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
p.cc-m-form-note {
display: none!important;
}
/*]]>*/
</style>
Mouseover Bildervergrößerung
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
@media (min-width: 760px) {
div#content_area a:link img,
div#content_area img,
.cc-catalog-container-new a.cc-webview-product-image img {
transition: transform 0.8s!important;
-moz-transition: transform 0.8s!important;
-webkit-transition: transform 0.8s!important;
-o-transition: transform 0.8s!important;
-ms-transition: transform 0.8s!important;
cursor: pointer!important;
}
div#content_area a:hover img {
cursor: zoom-in!important;
cursor: -moz-zoom-in!important;
cursor: -webkit-zoom-in!important;
transform: scale(1.15, 1.15)!important;
-moz-transform: scale(1.15, 1.15)!important;
-webkit-transform: scale(1.15, 1.15)!important;
-o-transform: scale(1.15, 1.15)!important;
-ms-transform: scale(1.15, 1.15)!important;
overflow: display!important;
-webkit-box-shadow: 0px 0px 40px 0px
rgba(0,0,0,0.64)!important;
-moz-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.64)!important;
box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.64)!important;
cursor: pointer!important;
}
div#content_area img {
cursor: auto!important;
}
}
/*]]>*/
</style>
Bildslider ohne Steuerelemente
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
.bx-wrapper .bx-controls-direction a,
.cc-m-gallery-slider .bx-wrapper .bx-controls-auto {
display: none!important;
}
/*]]>*/
</style>
Der letzte Punkt ist ….rot!
<style type="text/css">
/*<![CDATA[*/
/* jimdo-handbuch.de */
/* Elemente der Navigationsebene 1 rot */
.j-nav-level-0 li:last-child a:link,
.jtpl-navigation .j-nav-level-0 li:last-child a:link,
.jtpl-navigation .j-nav-level-0 li:last-child a:visited {
color: #ff0000!important;
}
/* Elemente der Navigationsebenen 2 und 3 schwarz */
.j-nav-level-1 li:last-child a:link,
.j-nav-level-2 li:last-child a:link,
.jtpl-navigation .j-nav-level-1 li:last-child a:link,
.jtpl-navigation .j-nav-level-2 li:last-child a:link,
.jtpl-navigation .j-nav-level-1 li:last-child a:visited,
.jtpl-navigation .j-nav-level-2 li:last-child a:visited {
color: inherit!important;
}
/*]]>*/
</style>