[رابط سهل] تخصيص لتصميم متحفظ: If Affiliate

2019 7 年 月 日 6

ما هو الرابط البسيط؟

يسهل Affiliate Easy Links إنشاء روابط لمواقع تسوق متعددة مثل Rinker و Kaeleva.

ما هو الرابط البسيط؟

إنها وظيفة تتيح لك إنشاء رابط تابع بسيط من نوع البطاقة (سريع الاستجابة). الرجاء إدخال عنوان URL لصفحة المنتج الخاصة بـ Rakuten Ichiba أو Amazon.co.jp أو كلمة البحث الأساسية في حقل URL.

https://af.moshimo.com/af/shop/service/easy-link-card

إنه ملائم للغاية لأنه لا بأس من إدخال عنوان URL لصفحة منتج واحدة ، ولكن الافتراضي صعب بعض الشيء ، أو كنت ضعيفًا بعض الشيء في التصميم الكبير.

إنه طويل عموديًا مثل هذا

هذه المرة ، قمت بتخصيصها لتصميم بسيط وغير مزعج.

حيث تغيرت

  • اسم المنتج: تصغير حجم الخط.عريض.
  • حجم الزر: تصغير.يتم أيضًا تقليل الهوامش.
  • أسفل الزر: إزالة الهوامش العريضة.
  • الزر: من البرتقال إلى الكريمة.تمت إضافة تأثير ثلاثي الأبعاد.
  • عند تمرير الماوس فوق: تمت إضافة حركة للضغط على الزر.
  • حجم الصورة: مخفض.

コ ー ド

تخصيص المظهر ← أضف الكود التالي إلى CSS.

/ * If Affiliate Easy Link Customization * / / * --- عنوان المنتج --- * / p.easyLink-info-name a {font-size: 16px! هام؛ font-weight: bold؛} / * --- حجم الزر --- * / div.easyLink-box div.easyLink-info p.easyLink-info-btn a {padding: 1px! important؛} شاشةmedia و (min-width: 704px) {div.easyLink-box div.easyLink-info p.easyLink-info-btn a {margin-bottom: 10px! هام؛}} / * --- أزل الفراغ الموجود أسفل الزر --- * / div.easyLink-box {padding: 10px؛ } div.easyLink-box div.easyLink-info p.easyLink-info-btn a: last-child {margin-bottom: 0! important؛} / * --- لون الزر --- * / a.easyLink-info - btn-amazon، a.easyLink-info-btn-rakuten، a.easyLink-info-btn-yahoo {color: # 333333! important؛ background: # FFFDE7! important؛ border: 1.2px solid # 808080! important؛ box - الظل: أقحم 0 2 بكسل 0 rgba (255,255,255,0.2،0،2،2) ، 0 0 بكسل 0 بكسل rgba (0.19 ، 0.1 ، 125 ، 125) ؛} / * - مؤشر الماوس فوق التأثير - * / a: hover.easyLink-info- btn-amazon، a: hover.easyLink-info-btn-rakuten، a: hover.easyLink-info-btn-yahoo {transform: translateY (XNUMXem)} / * --- حجم الصورة --- * / div. إيزي لينك-بوكس دي 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 -العرض: XNUMX بكسل! مهم ؛ أقصى ارتفاع: XNUMX بكسل! مهم ؛}

المدونة التي استخدمتها كمرجع
تخصيص الروابط السهلة للشريك التابع الخاص بك!لون الزر وتغيير النص وما إلى ذلك.