Liquid, JavaScript, Themes
Hallo,
habe eine Problem. Mein Shop ist noch im Aufbau und in den Endzügen. Mein Theme ist Impuls.
Habe das Produkt Geschenkgutschein aktiviert und angelegt. Als ich einen Test Gutschein versendet habe, habe ich festgestellt, dass der Code auf der Geschenkkarte nicht sichtbar ist. Der Code ist aber auf der Karte, nur in weißer Schriftfarbe in einem weißen Feld. Als ich die Schriftfarbe in meinem Theme von weiß auf schwarz abgeändert habe und den Gutschein erneut gesendet habe, war er sichtbar.
Da ich meinen Shop auf schwarzem Hintergrund und weißer Schrift aufgebaut habe, kann ich das natürlich nicht abändern.
Kann ich das Feld auf der Geschenkkarte von weiß auf schwarz ändern, so dass die weiße Schrift angezeigt wird? Wenn ja wie? Oder gibt es eine andere Lösung?
Danke und Gruß
Gelöst! Zur Lösung
Erfolg.
Wir bearbeiten dass jetzt und unsere Theme Spezialisten werden sich über dem Ticket melden. Gib denen bis zu 24 Std.
VG,
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hey @Dolle
Ich kann dir gerne ein paar Tipps geben zu wie du die Geschenkgutscheine generell schöner für deine Kunden gestalten und allen eine insgesamt besser Gutschein Erfahrung anbieten kannst.
Die Gutscheine kannst du auch gerne etwas umgestalten so wie du sie gerne hättest. Dafür habe ich hier eine Anleitung aus unserer Community wo man den Gutschein beliebig schöner gestalten kann. Mit einer unserer Digital downloads Apps (wie Sendowl oder Sky Pilot) kann man auch die Gutscheine als tolle pdf Downloads den Kunden anbieten, wenn man die nicht nur über eine E-Mail versenden möchte. Dafür braucht man aber den Basic Plan.
Lass wissen, ob ich deine Frage damit beantwortet habe 🙂
VG,
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hey Gabe,
danke für die Tipps, meine Frage war aber was ich tun muss um den Code auf der Geschenkarte für den Käufer sichtbar zu machen, ohne dass ich die Schriftsfarbe im theme auf schwarz ändern muss. Der Code ist in weißer Schrift im weißen Feld der Geschenkkarte.
Von daher ist die Frage leider nicht beantwortet 🙂
Gruß
Dafür müßte etwas Code wie das folgende zumgift-card.scss.liquid
hinzugefügt werden aber das kommt auf das Shop und das Theme an (Farben HEX Code anpassen). Wenn das ein Shopify Theme ist und du auf einem bezahlten Plan dann können wir das ggf. anschauen als Teil deiner 60-Min Design Time. Schicke uns eine E-Mail hier und unser Theme Team wird das anschauen können:
.giftcard__code__text {
color: #000;
}
Oder
$grid-medium:750px;$grid-large:990px;$grid-widescreen:1400px;$grid-gutter:30px;$grid-gutter-mobile:22px;$small:'small';$medium:'medium';$medium-down:'medium-down';$medium-up:'medium-up';$large:'large';$large-down:'large-down';$large-up:'large-up';$widescreen:'widescreen';$grid-breakpoint-has-widths:($small,$medium-up);$grid-breakpoint-has-push:($small,$medium-up);$color-text:{{settings.color_text}};$color-text-shadow:rgba(0,0,0,0.4);$color-body-text:{{settings.color_body_text}};$color-sale-text:{{settings.color_sale_text}};$color-small-button-text-border:{{settings.color_small_button_text_border}};$color-text-field:{{settings.color_text_field}};$color-text-field-text:{{settings.color_text_field_text}};$color-navigation-text:{{settings.color_text}};$color-btn-primary:{{settings.color_button}};$color-btn-primary-text:{{settings.color_button_text}};$color-text-focus:adaptiveColor({{settings.color_text}},{{settings.color_text|color_brightness}});$color-overlay-text-focus:adaptiveColor({{settings.color_image_overlay_text}},{{settings.color_image_overlay_text|color_brightness}});$color-btn-primary-focus:adaptiveColor({{settings.color_button}},{{settings.color_button|color_brightness}});$color-btn-social-focus:adaptiveColor({{settings.color_borders}},{{settings.color_borders|color_brightness}});$color-small-button-text-border-focus:adaptiveColor({{settings.color_small_button_text_border}},{{settings.color_small_button_text_border|color_brightness}});$color-link:$color-body-text;$opacity-link-hover:0.6;$transition-link-hover:0.1s cubic-bezier(0.44,0.13,0.48,0.87);$color-body:{{settings.color_body_bg}};$color-bg:{{settings.color_body_bg}};$color-drawer-background:rgba(0,0,0,0.6);$color-bg-alt:{{settings.color_body_text|color_modify:'alpha',0.05}};$color-overlay-title-text:{{settings.color_image_overlay_text}};$color-image-overlay:{{settings.color_image_overlay}};$opacity-image-overlay:{{settings.image_overlay_opacity|divided_by:100.00}};{%-comment-%}
Based on the image overlay opacity,either lighten or darken the image on hover
{%-endcomment-%}
{%assign image_overlay_opacity=settings.image_overlay_opacity|divided_by:100.00%};{%if image_overlay_opacity>0.85%}
{%assign image_overlay_opacity_hover=image_overlay_opacity|minus:0.3%};{%else%}
{%assign image_overlay_opacity_hover=image_overlay_opacity|plus:0.4%};{%endif%}
$hover-overlay-opacity:{{image_overlay_opacity_hover|at_most:1}};$color-border:{{settings.color_borders}};$color-border-form:{{settings.color_text_field_border}};$color-disabled:#f4f4f4;$color-disabled-border:#f4f4f4;$color-error:#d20000;$color-error-message-list:#651818;$color-error-bg:#fff8f8;$color-success:#1F873D;$color-success-bg:#f8fff9;$color-form-text:#333;$color-error-input-text:$color-error;$input-padding-top-bottom:10px;$input-padding-left-right:18px;$input-padding-top-bottom-small:8px;$input-padding-left-right-small:15px;$input-group-height:46px;$input-group-height-small:42px;$color-facebook:#3b5998;$color-twitter:#00aced;$color-pinterest:#cb2027;$width-site:1200px;$gutter-site:55px;$gutter-site-mobile:22px;$section-spacing:55px;$section-spacing-small:35px;$border-radius:2px;$footer-spacing-extra-small:5px;$footer-spacing-small:15px;$footer-wrapper-spacing:18px;$footer-hr-bottom-spacing:20px;$footer-spacing-medium:25px;$footer-spacing-large:45px;$z-index-dropdown:7;$z-index-sub-nav:8;$z-index-drawer:9;$z-index-announcement-bar:10;$z-index-skip-to-content:10000;$svg-select-icon:#{'{{ "ico-select.svg" | asset_url }}'};$transition-drawer:all 0.45s cubic-bezier(0.29,0.63,0.44,1);$color-slideshow-arrows:#000;$color-slideshow-dots:#fff;{%assign header_font=settings.type_header_font%}
{%assign base_font=settings.type_base_font%}
{{header_font|font_face}}
{{base_font|font_face}}
{%if settings.type_bold_product_titles%}
{%-assign header_font_bold=header_font|font_modify:'weight','bolder'-%}
{%endif%}
{%-assign base_font_bolder=base_font|font_modify:'weight','bolder'-%}
{%-assign base_font_bold=base_font|font_modify:'weight','bold'-%}
{%-assign base_font_italic=base_font|font_modify:'style','italic'-%}
{%-assign base_font_bold_italic=base_font_bold|font_modify:'style','italic'-%}
{{header_font_bold|font_face}}
{{base_font_bold|font_face}}
{{base_font_bolder|font_face}}
{{base_font_italic|font_face}}
{{base_font_bold_italic|font_face}}
$font-weight-body--bold:{{base_font_bold.weight|default:700}};$font-weight-body--bolder:{{base_font_bolder.weight|default:700}};$font-weight-header--bold:{{header_font_bold.weight|default:700}};$font-stack-header:{{header_font.family}},{{header_font.fallback_families}};$font-style-header:{{header_font.style}};$font-weight-header:{{header_font.weight}};$font-stack-body:{{base_font.family}},{{base_font.fallback_families}};$font-style-body:{{base_font.style}};$font-weight-body:{{base_font.weight}};$font-size-header:{{settings.type_header_base_size}}*1px;$font-bold-titles:{{settings.type_bold_product_titles}};$font-size-base:{{settings.type_base_size}}px;$font-stack-cart-notification:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;$font-size-mobile-input:16px;$color-giftcard-tooltip-fallback:#333;$color-giftcard-light:#fff;$color-giftcard-tooltip:rgba(0,0,0,0.9);$color-giftcard-disabled:#999;$color-giftcard-small-text:#b3b3b3;$color-giftcard-shadow:rgba(0,0,0,0.1);$color-giftcard-print-bg:#fff;$color-giftcard-print:#000;$color-giftcard-bg:#e95e61;$z-index-giftcard-image:2;$z-index-giftcard-corners:3;$z-index-giftcard-tooltip:4;$z-index-giftcard-code:5;.giftcard__apple-wallet-image{display:block;margin:0 auto}
@media print{@page{margin:0.5cm}
p{orphans:3;widows:3}
html,body{background-color:$color-giftcard-light;color:$color-giftcard-print}.giftcard__print-link,.giftcard__apple-wallet{display:none}}.template-giftcard{background:$color-body;.site-header__logo{padding-left:0}.site-header__logo-image{max-width:200px}.wrapper{max-width:588px;img,object,iframe{max-width:100%}}}.giftcard-wrapper{max-width:31rem;margin:0 auto}.giftcard__header{margin-top:$gutter-site*2}.giftcard__tag--active{opacity:0.6}.giftcard__wrap{position:relative;margin:($gutter-site/2)($gutter-site/2)$gutter-site;background-color:$color-giftcard-bg;border-radius:10px;img{position:relative;display:block;border-radius:10px;z-index:$z-index-giftcard-image}&::before,&::after{content:'';position:absolute;width:47px;height:47px;z-index:$z-index-giftcard-corners}&::before{background:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNDdweCIgaGVpZ2h0PSI0N3B4IiB2aWV3Qm94PSIwIDAgNDcgNDciIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDQ3IDQ3IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8ZyBvcGFjaXR5PSIwLjEiPgoJCTxwYXRoIGQ9Ik00NC41ODYsMUwxLDQ0LjU4NlYxMGMwLTQuOTYzLDQuMDM3LTksOS05SDQ0LjU4NiBNNDcsMEgxMEM0LjQ3NywwLDAsNC40NzcsMCwxMHYzN0w0NywwTDQ3LDB6Ii8+Cgk8L2c+CjwvZz4KPGc+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNDQuNTg2LDFMMSw0NC41ODZWMTBjMC00Ljk2Myw0LjAzNy05LDktOUg0NC41ODYiLz4KCTwvZz4KPC9nPgo8L3N2Zz4K')0 0 no-repeat;top:-1px;left:-1px}&::after{background:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNDdweCIgaGVpZ2h0PSI0N3B4IiB2aWV3Qm94PSIwIDAgNDcgNDciIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDQ3IDQ3IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8ZyBvcGFjaXR5PSIwLjEiPgoJCTxwYXRoIGQ9Ik0yLjQxNCw0Nkw0NiwyLjQxNFYzN2MwLDQuOTYzLTQuMDM3LDktOSw5SDIuNDE0IE0wLDQ3aDM3YzUuNTIzLDAsMTAtNC40NzcsMTAtMTBWMEwwLDQ3TDAsNDd6Ii8+Cgk8L2c+CjwvZz4KPGc+Cgk8Zz4KCQk8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMi40MTQsNDZMNDYsMi40MTRWMzdjMCw0Ljk2My00LjAzNyw5LTksOUgyLjQxNCIvPgoJPC9nPgo8L2c+Cjwvc3ZnPgo=')0 0 no-repeat;bottom:-1px;right:-1px}}.giftcard__code{position:relative;text-align:center;width:90%;z-index:$z-index-giftcard-code;margin:-70px auto 0px auto;padding:0 0 18px 0}.giftcard__code--medium{font-size:0.875em}.giftcard__code--small{font-size:0.75em}.giftcard__code__inner{display:inline-block;vertical-align:baseline;background-color:$color-giftcard-light;padding:0.5em;border-radius:4px;-webkit-box-shadow:0 0 0 1px $color-giftcard-shadow;box-shadow:0 0 0 1px $color-giftcard-shadow}.giftcard__code__text{font-size:1.875em;text-transform:uppercase;border:1px dashed $color-border-form;padding:0.4em 0.5em;display:inline-block;vertical-align:baseline;line-height:1;text-align:center;width:100%;&.disabled{color:$color-giftcard-disabled;text-decoration:line-through}}.giftcard__amount{position:absolute;top:0;right:0;color:$color-giftcard-light;font-size:2.75em;line-height:1.2;padding:10px;z-index:$z-index-giftcard-code;strong{display:block;text-shadow:2px 2px 0 $color-giftcard-shadow}}.giftcard__amount--medium{font-size:2em}.giftcard__tooltip{display:block;position:absolute;top:-50%;right:50%;margin-top:16px;z-index:$z-index-giftcard-tooltip;color:$color-giftcard-light;text-align:center;white-space:nowrap;&::before{content:'';display:block;position:absolute;left:100%;bottom:0;width:0;height:0;margin-left:-5px;margin-bottom:-5px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:5px solid $color-giftcard-tooltip-fallback;border-top:5px solid $color-giftcard-tooltip}}.giftcard__tooltip-label{display:block;position:relative;right:-50%;border:0;border-radius:4px;background-color:$color-giftcard-tooltip-fallback;background-color:$color-giftcard-tooltip;min-height:14px;font-size:12px;text-decoration:none;line-height:16px;text-shadow:none;padding:0.5em 0.75em;margin-left:0.25em;small{text-transform:uppercase;letter-spacing:0.1em;color:$color-giftcard-small-text;font-size:0.875em}}.giftcard-action-list{text-align:center}.giftcard-action-list__item{margin:0 0($section-spacing-small/1.8)}.giftcard__qr-code{img{padding:0;border:1px solid $color-border;border-radius:4px;margin:0 auto $gutter-site}}
@media screen and(max-width:580px){.giftcard{padding-top:$gutter-site*2}.print-link{display:none}}
@media screen and(max-width:400px){.giftcard__wrap::before,.giftcard__wrap::after{display:none}.giftcard__code{font-size:0.75em}.giftcard__code--medium{font-size:0.65em}.giftcard__code--small{font-size:0.55em}}
@media print{.giftcard__actions,.giftcard__wrap::before,.giftcard__wrap::after,.giftcard__tooltip{display:none}.shop-url{display:block;text-align:center}.qr-code{display:block}.print-link{display:none}.giftcard__code{margin-top:-90px}}
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Shopify Theme Impuls und kostenpflichtiger Shopify-Plan.
Nachricht ist soeben raus.
Gruß
Erfolg.
Wir bearbeiten dass jetzt und unsere Theme Spezialisten werden sich über dem Ticket melden. Gib denen bis zu 24 Std.
VG,
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Wurde das von unserem Team gelöst?
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Kann ich mir die Lösung bitte ansehen? habe das gleiche Problem
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024