[Einfacher Link] An ein diskretes Design anpassen: Wenn Partner
Was ist ein einfacher Link?
Mit Affiliate Easy Links können Sie ganz einfach Links zu mehreren Einkaufsseiten wie Rinker und Kaeleva erstellen.
Was ist ein einfacher Link?
Mit dieser Funktion können Sie auf einfache Weise einen einfachen Affiliate-Link vom Typ Karte erstellen (reaktionsschnell). Bitte geben Sie die URL der Produktseite von Rakuten Ichiba oder Amazon.co.jp oder das Suchwort in das URL-Feld ein.
https://af.moshimo.com/af/shop/service/easy-link-card
Es ist sehr praktisch, weil es in Ordnung ist, die URL einer Produktseite einzugeben, aber die Standardeinstellung ist etwas überwältigend, oder ich war beim großen Design etwas schwach.
Es ist vertikal so lang
Dieses Mal habe ich es an ein einfaches und unauffälliges Design angepasst.
Wo ich mich verändert habe
- Produktname: Reduzieren Sie die Schriftgröße.Fett gedruckt.
- Tastengröße: Miniaturisierung.Die Margen werden ebenfalls reduziert.
- Unterhalb der Schaltfläche: Breite Ränder entfernt.
- Knopf: Von Orange bis Creme.Ein dreidimensionaler Effekt wurde hinzugefügt.
- Wenn Sie mit der Maus darüber fahren: Bewegung zum Drücken der Taste hinzugefügt.
- Bildgröße: Reduziert.
コ コ ー
Erscheinungsbildanpassung → Fügen Sie dem CSS den folgenden Code hinzu.
/ * If Affiliate Easy Link Customization * / / * --- Produkttitel --- * / p.easyLink-info-name a {Schriftgröße: 16px! Wichtig; Schriftgröße: fett;} / * --- Tastengröße --- * / div.easyLink-box div.easyLink-info p.easyLink-info-btn a {padding: 1px! Important;} @ media-Bildschirm und (min-width: 704px) {div.easyLink-box div.easyLink-info p.easyLink-info-btn a {Rand-unten: 10px! Wichtig;}} / * --- Entfernen Sie das Leerzeichen unter der Schaltfläche --- * / div.easyLink-box {padding: 10px; } div.easyLink-box div.easyLink-info p.easyLink-info-btn a: letztes Kind {Rand-unten: 0! wichtig;} / * --- Tastenfarbe --- * / a.easyLink-info - btn-amazon, a.easyLink-info-btn-rakuten, a.easyLink-info-btn-yahoo {Farbe: # 333333! wichtig; Hintergrund: # FFFDE7! wichtig; Rand: 1.2px fest # 808080! wichtig; Box - Schatten: Einschub 0 2px 0 rgba (255,255,255,0.2), 0 2px 2px rgba (0, 0, 0, 0.19);} / * --- Maus über Effekt --- * / a: hover.easyLink-info- btn-amazon, a: hover.easyLink-info-btn-rakuten, a: hover.easyLink-info-btn-yahoo {transform: translateY (0.1em)} / * --- Bildgröße --- * / div. easyLink-box di v.easyLink-img, div.easyLink-box div.easyLink-img p.easyLink-img-box, div.easyLink-box div.easyLink-img p.easyLink-img-box img.easyLink-img-pht {max -Breite: 125px! wichtig; maximale Höhe: 125px! wichtig;}
Der Blog, den ich als Referenz verwendet habe
Passen Sie die einfachen Links Ihres Partners an!Tastenfarbe, Textänderung usw.