شخصی سازی سبد خرید EDD وردپرس

سلام دوستان ، برای این که سبد خرید قشنگی تری برای فروشگاه وردپرس خودمون درست کنیم و بازاریابی بهتری انجام بدیم ، امروز یک استایل زیبا برای شخصی سازی سبد خرید افزونه EDD وردپرس رو آماده کردم .

نرخ تبدیل یا ضریب تبدیل فروشگاه چیست ؟

بازدید کننده های سایت شما ، ممکن هستش از محصولات شما خوششون بیاد ، قصد خرید داشته باشند و … و به هر حال روی دکمه خرید کلیک می کنند و شاید یکسری تا مراحلی طی کنند و ادامه خرید ندهند و ادامه خرید را رها کنند . نسبتی از کسانی که خرید را کامل انجام می دهند به کسانی که قصد خرید داشتند رو نرخ یا ضریب تبدیل میگیم .

برای افزایش این نرخ تبدیل و فروش و درآمد بیشتر مهم هستش که فرآیند خرید رو ساده تر و قشنگ تر و راحت تر کنید . یکی از این موارد شخصی سازی و استایل دهی و قشنگ کردن سبد خرید هستش که اگر از افزونه EDD وردپرس برای فروش فایل استفاده می کنید ، این مطلب برای شما مفید خواهد بود .

شخصی سازی و استایل سبد خرید EDD وردپرس

برای این کار نیاز هستش که کلاس و یا id قسمت مورد نظر رو وارد استایل قالب خودتون بکنید ، چون که اگر استایل خوده افزونه EDD رو دست بزنید بعد از آپدیت افزونه دوباره همه چیز میپره و از بین میره ، این مورد در مورد افزونه contact form 7 یا افزونه syntaxhighlighter و یا شخصی سازی هر افزونه دیگری هم صادقه .

چجوری کلاس یا id قسمت های مختلف برای استایل دهی رو پیدا کنیم ؟

میتونید به راحتی از inspect element گوگل کروم یا مرورگر های دیگه انجامش بدین .

حالا که class یا id رو پیدا کردید ، مقادیر دلخواه خودتون رو در فایل استایل قالب خودتون اضافه کنید .

نکته مهم : چون دارید از همون class یا id استفاده می کنید ، حتما باید important! رو اضافه کنید ، به طور مثال :

.edd-submit.button.blue{background: #50CA42!important;border-color: #30a323!important;}

استایل آماده فیلد ها و سبد خرید EDD وردپرس

ما برای سایت خودمون یکسری کد آماده کردیم ، به صورت آماده و یکجا در اختیار شما قرار میدیم تا در انتهای فایل style.css قالب خودتون قرار بدید تا سبد خرید سایتتون این شکلی بشه .

همچنین بعد از پرداخت و مراجعت به سایت ، قسما اطلاعات پرداخت و دانلود فایل هم جدولی داره که اونم به شکل زیر میشه .

خوب می رسیم به خود کدها ، اگر خودتون نخواستید شخصی سازی کنید برای قالب خودتون ، می تونید از کدهای آماده زیر استفاده کنید ، این کدهای زیر رو در انتهای فایل style.css قالب خودتون ( دقت کنید نه در فایل استایل افزونه EDD ) قرار بدید .

.edd-cart-added-alert{position:relative;margin:10px 0 0;color:#3C763D;background-color:#DFF0D8;border:1px solid #D6E9C6;padding:10px;border-radius:4px}
#edd_checkout_cart td,#edd_checkout_cart th{text-align:right}table{border:1px solid #DFDFDF;background-color:#F9F9F9;border-radius:3px;font-family:BYekan,tahoma;color:#333;border-collapse:separate;border-spacing:0}table td,table th{border-top:1px solid #fff;border-bottom:1px solid #DFDFDF;color:#555}table th{text-shadow:0 1px 0 #fff;font-family:BYekan,tahoma;font-weight:400;font-size:18px}
.edd_cart_total{text-align:left!important}
.edd_cart_total,thead{font-size:22px!important}
#edd_checkout_cart td img{float:right;margin:3px 0 0 8px}td,th,tr{text-align:right!important;padding-right:20px}
.widget .list-group-item{padding:10px;margin-bottom:5px;background-color:#F5F5F5;border:none;border-radius:3px}
.edd-submit.button,.edd-submit.button.gray,.edd-submit.button:visited{border:none}
.single-download .edd_download_purchase_form{margin:0!important}
#edd_checkout_cart td img{width:90px;height:90px;}
.edd_checkout_cart_item_title{}
#edd_checkout_form_wrap{
font-family: Byekan;
font-size: 18px;
font-weight: bold;
}
#edd_checkout_form_wrap span.edd-description{font-size: 65%;}
#edd_checkout_form_wrap p{margin: 0 0 12px!important}
#edd_checkout_form_wrap input[type=email], #edd_checkout_form_wrap input[type=password], #edd_checkout_form_wrap input[type=text], #edd_checkout_form_wrap textarea{
padding: 11px 11px!important;
font-family: Byekan;
font-size: 18px;
font-weight: bold;
background: #f9f9f9;
border: solid 1px #eeeeee;
color: #878787;
}
#edd_checkout_form_wrap span.edd-description{display:none!important}
#edd_checkout_form_wrap label{margin: 0 0 15px 0!important;color:#777777;}
#edd_checkout_form_wrap fieldset{padding: 10px 0 0 0;margin: 0 0 21px;border:none!important;}
#edd-purchase-button, .edd-submit, input[type=submit].edd-submit{
padding: 11px 50px!important;
font-size: 19px!important;
font-family: Byekan;
margin:10px 0 10px 0!important;}
#edd_checkout_cart td{font-size: 17px;}
.edd-submit.button.blue{background: #50CA42!important;border-color: #30a323!important;}

به نکات زیر دقت کنید فقط .در کدهای بالا این کد رو دقت کنید

#edd_checkout_cart td img{width:90px;height:90px;}

ما اندازه تصویر محصول رو روی طول و عرض۹۰ تنظیم کردیم خودتون متناسب با تصاویر بندانگشتی قالب خودتون تغییرش بدید .

دوم اینکه ما اومدیم از فونت Byekan استفاده کردیم ، اگر قالب شما این فونت رو نداره ، یا فونت رو تغییر بدید یا طبق آموزش زیر فونت Byekan رو به قالب خودتون اضافه کنید . آموزش استفاده و دانلود فونت Byekan

امیدوارم استفاده کرده باشید ، یا حق