iwf2050

استایل سفارشی فرم تماس 7

11 پست در این موضوع قرار دارد

سلام خدمت اساتید گرامی و محترم

بنده برای قسمت تماس با ما سایت خودم از افزونه فرم تماس 7 استفاده کردم که البته استایل خاصی ندارد .

میخواستم در صورت امکان یک استایل سفارشی براش داشته باشم . ممنونم میشم راهنمایی کنید.

آدرس تماس با ما  سایت بنده : http://navidak.ir/contact-us/

اگر مشابه این بشه خیلی خوبه : https://www.graphicyab.com/ads/

 

ممنون

0

به اشتراک گذاری این پست


لینک به پست

با استفاده از css این امکان وجود داره تا استایل سفارشی برای فرم خود ایجاد کنید.

فرم تماس 7 قابلیت سفارشی سازی استایل (CSS) را بصورت پیش فرض دارد.

1

به اشتراک گذاری این پست


لینک به پست

امکانش هست کد های سی اس اس سایت مورد نظر بنده را استخراج کنید؟

0

به اشتراک گذاری این پست


لینک به پست

اطلاعات css سایت شما؟؟
اگه منظورتون نام کلاس های فرم هست از طریق inspect element مرورگر خودتون میتونید مشاهده کنید.

توصیه میشه از طریق سفارشی سازی استایل فرم تماس 7 استفاده کنید.

1

به اشتراک گذاری این پست


لینک به پست
در 1 ساعت قبل، iwf2050 گفته است :

امکانش هست کد های سی اس اس سایت مورد نظر بنده را استخراج کنید؟

سلام ، این کدو به فایل  css  تون اضافه کنید

wpcf7-form label{ 
	position:relative;
	width:100%;
}
wpcf7-form label input,
.wpcf7 textarea{ 
	width:100%;
    border: 1px solid #CCC;
    padding: 7px 5px;
}
wpcf7-form label:before { 
conntent: '';
position: absolute;
background: #090;
width: 10px;
height: 10px;
right: 0;
top: 6px;
}

 

3

به اشتراک گذاری این پست


لینک به پست

فقط ی بخشی از فرم تغییر کرد

نمونه آنلاین : http://navidak.ir/contact-us/

خواهش میکنم لطف کنید مجددا بررسی نمایید

 

0

به اشتراک گذاری این پست


لینک به پست

@Ghasemi

0

به اشتراک گذاری این پست


لینک به پست
در 3 ساعت قبل، iwf2050 گفته است :

فقط ی بخشی از فرم تغییر کرد

نمونه آنلاین : http://navidak.ir/contact-us/

خواهش میکنم لطف کنید مجددا بررسی نمایید

 

.wpcf7-text {
    width: 100%!important;
}
.wpcf7-text:hover{
background:#EAE7E7
}
.wpcf7 input[type="submit"] {

    background: #56b881;
    color: #FFF;
    padding: 7px 10px;
    font: 16px dinar;
    cursor: pointer;
    border: 2px solid #56b881;
    width:100%!important

}
.wpcf7 input[type="submit"]:hover{
      background: white; 
    color:#56b881
}
.wpcf7-form-control-wrap {
    position: relative;
    right: -15px;

}
.wpcf7 label {
    padding-right: 20px;

}
.wpcf7 label::before {

    content: "";
    position: absolute;
    background: #090;
    width: 10px;
    height: 10px;
    border-radius: 50px;
    margin-left: 30px;
    right: 5px;
    top: 5px;

}
.wpcf7-form {

    padding-top: 30px;

}
.wpcf7 label{
position: relative;
}

 

2

به اشتراک گذاری این پست


لینک به پست

فقط بخشی از قالب تغییر کرد،

و نتیجه جالب نشده

0

به اشتراک گذاری این پست


لینک به پست
در در 10/10/2018 at 10:10، iwf2050 گفته است :

فقط بخشی از قالب تغییر کرد،

و نتیجه جالب نشده

.wpcf7-form-control-wrap {
    right: -15px;

}

 الان دقیقا کدوم قسمتش شبیه سایتی که آدرس دادید نشده ؟؟

2

به اشتراک گذاری این پست


لینک به پست

درستش کردم  با تشکر و احترام فراوان

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری