Hi there! I am new here and I`ve been trying to change my shipping slip font into the one used in my store.
Ive been trying this for 3hrs now following earlier guidelines found on this platform. Im an elder lady and I have no experience with coding. I`d like to change my font into: Shadows into light. Could anybody help? Thanks!
Hi @Eau1
Could you please share with me your store URL and also could you please describe further about which you want to adjust? A screenshot could help a lot!
Best,
Daisy
Hi Daisy,
My shop hasnt been launched yet. Its going to be Eau Art.
The problem sits in my packing slip. I want to change the font of it. I need to add code into the below. I managed to add my logo in the packing slip. But can`t achieve changing the letter typography into Shadows into light for some reason. I hope you can help!
Thank you!
Order {{ order.name }}
{% if order.po_number != blank %}PO number #{{ order.po_number }}
{% endif %}{{ order.created_at | date: format: "date" }}
{% if delivery_method.instructions != blank %} Delivery to {% else %} Ship to {% endif %}
{% if shipping_address != blank %}
{{ shipping_address.name }}
{% if shipping_address.company != blank %}
{{ shipping_address.company }}
{% endif %}
{{ shipping_address.address1 }}
{% if shipping_address.address2 != blank %}
{{ shipping_address.address2 }}
{% endif %}
{% if shipping_address.city_province_zip != blank %}
{{ shipping_address.city_province_zip }}
{% endif %}
{{ shipping_address.country }}
{% if shipping_address.phone != blank %}
{{ shipping_address.phone }}
{% endif %}
{% else %}
No shipping address
{% endif %}
Bill to
{% if billing_address != blank %}
{{ billing_address.name }}
{% if billing_address.company != blank %}
{{ billing_address.company }}
{% endif %}
{{ billing_address.address1 }}
{% if billing_address.address2 != blank %}
{{ billing_address.address2 }}
{% endif %}
{% if billing_address.city_province_zip != blank %}
{{ billing_address.city_province_zip }}
{% endif %}
{{ billing_address.country }}
{% else %}
No billing address
{% endif %}
Items
Quantity
{% comment %}
To adjust the size of line item images, change desired_image_size.
The other variables make sure your images print at high quality.
{% endcomment %}
{% assign desired_image_size = 58 %}
{% assign resolution_adjusted_size = desired_image_size | times: 300 | divided_by: 72 | ceil %}
{% capture effective_image_dimensions %}
{{ resolution_adjusted_size }}x{{ resolution_adjusted_size }}
{% endcapture %}
{% for line_item in line_items_in_shipment %}
{{ line_item.title }} {% if line_item.variant_title != blank %} {{ line_item.variant_title }} {% endif %} {% if line_item.sku != blank %} {{ line_item.sku }} {% endif %} {% for group in line_item.groups %} Part of: {{ group.title }} {% endfor %}
{{ line_item.shipping_quantity }} of {{ line_item.quantity }}
There are other items from your order not included in this shipment.
{% endunless %}Notes
{{ order.note }}
Delivery instructions
{{ delivery_method.instructions }}
Thank you for embarking on this enchanting shopping journey with us!
{{ shop_address.summary }}
{{ shop.email }}
{{ shop.domain }}
.wrapper {
width: 831px;
margin: auto;
padding: 4em;
font-family: “Noto Sans”, sans-serif;
font-weight: 250;
}
.header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
flex-direction: row;
align-items: top;
}
.header p {
margin: 0;
}
.shop-title {
-webkit-box-flex: 6;
-webkit-flex: 6;
flex: 6;
font-size: 1.9em;
}
.order-title {
-webkit-box-flex: 4;
-webkit-flex: 4;
flex: 4;
}
.customer-addresses {
width: 100%;
display: inline-block;
margin: 2em 0;
}
.address-detail {
margin: 0.7em 0 0;
line-height: 1.5;
}
.subtitle-bold {
font-weight: bold;
margin: 0;
font-size: 0.85em;
}
.to-uppercase {
text-transform: uppercase;
}
.text-align-right {
text-align: right;
}
.shipping-address {
float: left;
min-width: 18em;
max-width: 50%;
}
.billing-address {
padding-left: 20em;
min-width: 18em;
}
.order-container {
padding: 0 0.7em;
}
.order-container-header {
display: inline-block;
width: 100%;
margin-top: 1.4em;
}
.order-container-header-left-content {
float: left;
}
.order-container-header-right-content {
float: right;
}
.flex-line-item {
display: -webkit-box;
display: -webkit-flex;
display: flex;
flex-direction: row;
align-items: center;
margin: 1.4em 0;
page-break-inside: avoid;
}
.flex-line-item-img {
margin-right: 1.4em;
min-width: {{ desired_image_size }}px;
}
.flex-line-item-description {
-webkit-box-flex: 7;
-webkit-flex: 7;
flex: 7;
}
.line-item-description-line {
display: block;
}
.flex-line-item-description p {
margin: 0;
line-height: 1.5;
}
.flex-line-item-quantity {
-webkit-box-flex: 3;
-webkit-flex: 3;
flex: 3;
}
.subdued-separator {
height: 0.07em;
border: none;
color: lightgray;
background-color: lightgray;
margin: 0;
}
.missing-line-items-text {
margin: 1.4em 0;
padding: 0 0.7em;
}
.notes {
margin-top: 2em;
}
.notes p {
margin-bottom: 0;
}
.notes .notes-details {
margin-top: 0.7em;
}
.footer {
margin-top: 2em;
text-align: center;
line-height: 1.5;
}
.footer p {
margin: 0;
margin-bottom: 1.4em;
}
hr {
height: 0.14em;
border: none;
color: black;
background-color: black;
margin: 0;
}
.aspect-ratio {
position: relative;
display: block;
background: #fafbfc;
padding: 0;
}
.aspect-ratio::before {
z-index: 1;
content: “”;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border: 1px solid rgba(195,207,216,0.3);
}
.aspect-ratio–square {
width: 100%;
padding-bottom: 100%;
}
.aspect-ratio__content {
position: absolute;
max-width: 100%;
max-height: 100%;
display: block;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
Hi Daisy, My store isn`t live yet. I managed to add my logo into the packing slip.
There is some coding that need to happen to change the font. Not sure what to type into editing the packing slip.
Cheers!