Woocommerce Produkt thumbnail bildergröße / schwierigkeiten beim vergrößern
-
Hallo,
ich habe mir erst lokal eine Webseite erstellt und nun diese hochgeladen rouzbehhamzalufard.com ich bin Künstler und mache Gemälde, Skulpturen usw. und wollte die Seite als Homepage mit kleiner Shop Funktion betreiben. So weit es mir möglich war habe ich hier die Suchfunktion fleißig benutzt usw. und konnte viel lernen und bin auch zufrieden mit WordPress.
Ich benutze das Theme von TeFox Azeria http://azeria.tefox.net/ incl. Azeria Portfolio u. Azeria WooCommerce package, so gesehen bin ich ganz zurfrieden, habe mir ein Child Teheme angelegt und losgelegt. Nun bin ich leider an einer stelle angekommen, wo ich trotz suchen im web und hier im Forum einfach nicht weiter komme bzw. alle beschriebenen Vorgehensweisen die ich gefunden habe nicht funktionieren.
Ich möchte im Shop die Produkte thumbnail Bildergröße wie in der Teheme Demo vergrößern, dafür habe ich einiges versucht, aber leider ohne erfolg.
Ich habe in der functions.php mit den unten angezeigten Daten gearbeitet, post-thumbnail u. slider thumbnail funktionieren und lassen sich verändern, related thumbnail verändert sich nicht. Auch nicht nachdem ich mit dem Plugin / Werkzeug Vorschaubilder regenerieren alles neu berechnen lasse.
/** * Allow to rewrite defined image sizes from child theme */ $default_image_sizes = array( 'post-thumbnail' => array( 'width' => 450, 'height' => 300, 'crop' => true ), 'slider-thumbnail' => array( 'width' => 1900, 'height' => 445, 'crop' => true ), 'related-thumbnail' => array( 'width' => 450, 'height' => 300, 'crop' => true
Ich habe auch in der Costum Css diverse befehle versucht die ich hier und da im Netz gefunden habe, auch leider ohne Erfolg. Auch im style.css habe ich geschaut, jedoch weiß ich nicht was ich da genau ändern muss bzw. blicke als Laie noch nicht ganz durch bzw. wollte bevor ich da dran gehe erst hier nachfragen.
.entry-thumbnail { margin: 0 -30px; overflow: hidden; clear: both; } .entry-thumbnail img { display: block; } .entry-thumbnail + .entry-content { padding: 30px 0 0 0; } .is-single > .entry-thumbnail { margin: -30px -30px 30px; } .is-single > .entry-thumbnail + .entry-content { padding: 40px 0 0 0; } .entry-thumbnail a, .popup-gallery-item, .image-popup { float: left; position: relative; max-width: 100%; overflow: hidden; } .entry-thumbnail a img, .popup-gallery-item img, .image-popup img { display: block; } .entry-thumbnail a:before, .entry-thumbnail a:after, .popup-gallery-item:before, .popup-gallery-item:after, .image-popup:before, .image-popup:after { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; content: ''; opacity: 0; -webkit-transition: opacity 350ms, -webkit-transform 350ms; transition: opacity 350ms, transform 350ms; } @media (max-width: 767px) { .entry-thumbnail a:before, .entry-thumbnail a:after, .popup-gallery-item:before, .popup-gallery-item:after, .image-popup:before, .image-popup:after { top: 15px; right: 15px; bottom: 15px; left: 15px; } } .entry-thumbnail a:before, .popup-gallery-item:before, .image-popup:before { border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0, 1); transform: scale(0, 1); } .entry-thumbnail a:after, .popup-gallery-item:after, .image-popup:after { border-right: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: scale(1, 0); transform: scale(1, 0); } .entry-thumbnail a .link-marker, .popup-gallery-item .link-marker, .image-popup .link-marker { background: #ff5400; width: 88px; height: 88px; line-height: 88px; text-align: center; border: 16px solid rgba(255, 255, 255, 0.7); position: absolute; top: 50%; left: 50%; margin: -30px 0 0 -60px; border-radius: 60px; font-size: 50px; color: #fff; opacity: 0; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-background-clip: content-box; -moz-background-clip: content-box; background-clip: content-box; -webkit-transition: all 350ms; transition: all 350ms; } @media (max-width: 767px) { .entry-thumbnail a .link-marker, .popup-gallery-item .link-marker, .image-popup .link-marker { width: 60px; height: 60px; line-height: 60px; border-width: 10px; margin: -20px 0 0 -40px; border-radius: 40px; font-size: 35px; } } .entry-thumbnail a .link-marker:before, .popup-gallery-item .link-marker:before, .image-popup .link-marker:before { content: "\f0c1"; font-family: FontAwesome; } .entry-thumbnail a .link-marker.popup:before, .popup-gallery-item .link-marker.popup:before, .image-popup .link-marker.popup:before { content: "\f067"; } .entry-thumbnail a:hover:before, .entry-thumbnail a:hover:after, .popup-gallery-item:hover:before, .popup-gallery-item:hover:after, .image-popup:hover:before, .image-popup:hover:after { opacity: .8; -webkit-transform: scale(1); transform: scale(1); } .entry-thumbnail a:hover .link-marker, .popup-gallery-item:hover .link-marker, .image-popup:hover .link-marker { color: #fff; opacity: 1; margin-top: -60px; } @media (max-width: 767px) { .entry-thumbnail a:hover .link-marker, .popup-gallery-item:hover .link-marker, .image-popup:hover .link-marker { margin-top: -40px; } } /* Sticky post */ .is-loop.sticky .entry-header { position: relative; } .is-loop.sticky .entry-header > * { position: relative; z-index: 2; } .is-loop.sticky .entry-header:after { position: absolute; width: auto; top: -30px; right: -30px; bottom: 0; left: -30px; border: 5px solid #ff5400; content: ""; z-index: 1; } .is-loop.sticky .entry-header + .entry-content { padding: 20px 0 0 0; } .left-sidebar { float: right !important; } .entry-footer:after { clear: both; width: 100%; display: block; content: ""; } .is-single .entry-footer { border-top: 1px solid #ff5400; padding: 20px 0 0 0; margin: 10px 0 0 0; } .etry-more-btn { float: right; margin: 0 -30px 0 0; } .entry-gallery { margin: 0 -30px; position: relative; } .entry-gallery + .entry-content { padding-top: 30px; } .entry-gallery-item { margin: 0; position: relative; } .entry-gallery-item img { display: block; } .entry-gallery-item.nth-child { display: none; } .entry-gallery-item.nth-child.slick-slide { display: block; } .entry-gallery-prev, .entry-gallery-next { position: absolute; width: 48px; height: 48px; line-height: 48px; top: 50%; margin: -24px 0 0 0; background: #2b5387; color: #fff; font-size: 30px; cursor: pointer; text-align: center; transition: all 200ms ease-in; } .entry-gallery-prev:before, .entry-gallery-next:before { font-family: FontAwesome; } .entry-gallery-prev:hover, .entry-gallery-next:hover { background: #ff5400; } .entry-gallery-prev { left: 30px; } .entry-gallery-prev:before { content: "\f104"; } .entry-gallery-next { right: 30px; } .entry-gallery-next:before { content: "\f105"; } .entry-gallery-caption { color: #fff; position: absolute; bottom: 0; left: 0; right: 0; padding: 15px; background: #0b1f39; background: rgba(11, 31, 57, 0.7); } .entry-image { margin: 0 -30px; } .entry-image + .entry-content { padding-top: 30px; } .entry-image:after { clear: both; width: 100%; display: block; content: ""; } .entry-image-item { margin: 0; } .entry-image-item img { display: block; } .entry-video { margin: 0 -30px; position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .entry-video iframe, .entry-video object, .entry-video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .entry-video + .entry-content { padding-top: 30px; } .error-404 { text-align: center; } .error-404 .page-content { background: none; padding: 0; } .error-404-num { padding: 40px 0; font-size: 140px; line-height: 140px; color: #ff5400; font-family: "Montserrat Alternates", sans-serif; } .error-404 .search-form { display: inline-block; padding: 30px 60px; margin: 0; background: #fff; } @media (max-width: 500px) { .error-404 .search-form { padding: 20px; overflow: hidden; } .error-404 .search-form > label { width: 65%; float: left; } .error-404 .search-form .search-submit { float: left; width: 35%; } } .error-404 .search-form input { vertical-align: top; } /*-------------------------------------------------------------- ## Asides --------------------------------------------------------------*/ .blog .format-aside .entry-title, .archive .format-aside .entry-title { display: none; }
Anschließend habe ich mir auch die woocommerce.php angeschaut und habe auch ein enige diese werte verändern, jedoch hat es absolut nichts gebracht.
* Add WC Image sizes to WP. * * @since 2.3 */ private function add_image_sizes() { $shop_thumbnail = wc_get_image_size( 'shop_thumbnail' ); $shop_catalog = wc_get_image_size( 'shop_catalog' ); $shop_single = wc_get_image_size( 'shop_single' ); add_image_size( 'shop_thumbnail', $shop_thumbnail['width'], $shop_thumbnail['height'], $shop_thumbnail['crop'] ); add_image_size( 'shop_catalog', $shop_catalog['width'], $shop_catalog['height'], $shop_catalog['crop'] ); add_image_size( 'shop_single', $shop_single['width'], $shop_single['height'], $shop_single['crop'] ); }
Hmm mir ist bewusst das es wirklich besser ist und für die Lernkurve auch vorteilhafter wenn man diese dinge selber herausfindet, aber leider habe ich sehr viel versucht und komme wirklich nicht weiter. Falls der eine oder andere etwas zeit erübrigen kann und mich in die richtige Richtung schicken kann bzw. mir einen Lösungsweg zeigt, wäre ich sehr dankbar. In diesem sinne vielen dank im Voraus..
Moderationshinweis: Dein Beitrag war wegen des hohen Anteils an Code erst einmal im Spam-Filter gelandet. Bitte verwende künftig Dienste wie GitHub oder Pastebin.com, wenn du größere Mengen an Code teilen möchtest. Vielen Dank, Bego
- Das Thema „Woocommerce Produkt thumbnail bildergröße / schwierigkeiten beim vergrößern“ ist für neue Antworten geschlossen.