Shopify Liquid

Buy 3 Pay 2

Drop this Shopify Liquid snippet into your theme to add the buy 3 pay 2 block. Copy the code below, paste it into your theme files, save and you're done.

55 lines · 1.2 KB

Shopify Liquid

1<!DOCTYPE html>
2<html lang="en">
3<head>
4<meta charset="UTF-8">
5<meta name="viewport" content="width=device-width, initial-scale=1.0">
6<title>Modern Badge Design</title>
7<style>
8.unique-badge-container-A1B2C3 {
9  display: flex;
10  gap: 10px;
11  font-family: Arial, sans-serif;
12}
13
14.unique-badge-D4E5F6 {
15  display: flex;
16  align-items: center;
17  padding: 3px 10px;
18  border-radius: 8px;
19  font-size: 12px;
20  font-weight: bold;
21  transition: background-color 0.3s, box-shadow 0.3s, transform 0.3s;
22  cursor: pointer;
23}
24
25.unique-badge-D4E5F6:hover {
26  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
27  transform: translateY(-2px);
28}
29
30.unique-coupon-badge-G7H8I9 {
31  background-color: #C8E6C9; /* Açık Yeşil */
32  color: #388E3C;
33  opacity: 0.8; /* Yarı transparanlık */
34}
35
36.unique-three-for-two-badge-J1K2L3 {
37  background-color: #f0f0f0; /* #fafafa'nın bir ton koyusu */
38  color: #666666; /* Daha koyu bir gri ton */
39}
40</style>
41</head>
42<body class="unique-body-V4W5X6">
43
44<div class="unique-badge-container-A1B2C3">
45  <div class="unique-badge-D4E5F6 unique-coupon-badge-G7H8I9">
46    Coupon Deal
47  </div>
48  <div class="unique-badge-D4E5F6 unique-three-for-two-badge-J1K2L3">
49    Buy 3 Pay 2
50  </div>
51</div>
52
53</body>
54</html>

Related snippets

/ shopify liquid

Buy 3 Pay 2

Related snippets

Click Discount

Comparison table

Comparison Table 2

Copyable discount bar