سلام به همه دوستان خوبم در پارس جوم
در اینجا دیدن لینک ها برای شما امکان پذیر نیست. لطفا
ثبت نام کنید یا
وارد حساب خود شوید تا بتوانید لینک ها را ببینید.
آموزش استایل اختصاصی فرم
در فرمساز محبوب اراس فرم خدمت دوستان تقدیم کرده بودم بعضی از دوستان با این آموزش مشکل داشتند و موفق به انجام نشده بودن.
به همین منظور یک فرم که با همون روش ساختم را برای دوستان قرار میدم
توجه داشته باشید اگر در این فرم فیلدی را اضافه یا کم میکنید
در مدیریت فرم>خواص>طرح بندی>(XHTML)دو سطر>نام تگ های موجود را با نام یکتای فیلد جایگزین
و در صورت عدم استفاده از فیلد تگ را از "<li>" تا "</li>" حذف کنید.
برای تغییر در اندازه و رنگ فرم نیز
از مدیریت فرم>CSS و Javascript کدهای موجود را ویرایش کنید.
نکته آخر
ممکن است کدها CSS و Javascript با بعضی قالب ها همخوانی نداشته باشد و باعث بهم ریختن قالب شود که بسته به قالب باید ویرایش شود.
کدهای CSS و Javascript
<style type="text/css">
.formFieldset {
background:none repeat scroll 0 0 #34c4fa;
border:1px solid #000000;
margin:0 auto;
padding:10px;
width:550px;
}
.formFieldset fieldset {
border:1px solid #FFFFFF;
display:block;
font-family:verdana,sans-serif;
line-height:1.5em;
margin-bottom:0.5em;
padding:5px;
width:530px;
}
.formFieldset fieldset#header {
background:none;
}
.formFieldset fieldset#personal {
background:url("images/user1.jpg") no-repeat scroll 350px 10px transparent;
}
.formFieldset fieldset#information {
background:url("images/email.jpg") no-repeat scroll 320px 10px transparent;
}
.formFieldset fieldset#footer {
background:none;
}
.formFieldset legend {
background:url("images/leg.jpg") repeat-x scroll right center #FFFFFF;
border:3px solid #FFFFFF;
font-family:georgia,sans-serif;
font-size:1.1em;
font-weight:bold;
margin-bottom:5px;
padding:3px;
width:254px;
}
</style>
کدهای طرح بندی این قالب
<fieldset class="formFieldset">
<legend>{global:formtitle}</legend>
{error}
<ol class="formContainer">
<fieldset id="header">
<li>
<div class="formCaption2">{Header:caption}</div>
<div class="formBody">{Header:body}<span class="formClr">{Header:validation}</span></div>
<div class="formDescription">{Header:description}</div>
</li>
</fieldset>
<fieldset id="personal">
<legend>اطلاعات ثبت نام در سایت</legend>
<li>
<div class="formCaption2">{user:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{user:body}<span class="formClr">{user:validation}</span></div>
<div class="formDescription">{user:description}</div>
</li>
<li>
<div class="formCaption2">{pasword1:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{pasword1:body}<span class="formClr">{pasword1:validation}</span></div>
<div class="formDescription">{pasword1:description}</div>
</li>
<li>
<div class="formCaption2">{pasword2:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{pasword2:body}<span class="formClr">{pasword2:validation}</span></div>
<div class="formDescription">{pasword2:description}</div>
</li>
<li>
<div class="formCaption2">{Email:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{Email:body}<span class="formClr">{Email:validation}</span></div>
<div class="formDescription">{Email:description}</div>
</li>
</fieldset>
<fieldset id="information">
<legend>اطلاعات تکمیلی</legend>
<li>
<div class="formCaption2">{name:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{name:body}<span class="formClr">{name:validation}</span></div>
<div class="formDescription">{name:description}</div>
</li>
<li>
<div class="formCaption2">{last name:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{last name:body}<span class="formClr">{last name:validation}</span></div>
<div class="formDescription">{last name:description}</div>
</li>
<li>
<div class="formCaption2">{madrak:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{madrak:body}<span class="formClr">{madrak:validation}</span></div>
<div class="formDescription">{madrak:description}</div>
</li>
<li>
<div class="formCaption2">{reshteh:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{reshteh:body}<span class="formClr">{reshteh:validation}</span></div>
<div class="formDescription">{reshteh:description}</div>
</li>
<li>
<div class="formCaption2">{nezam pezeshki:caption}<strong </strong></div>
<div class="formBody">{nezam pezeshki:body}<span class="formClr">{nezam pezeshki:validation}</span></div>
<div class="formDescription">{nezam pezeshki:description}</div>
</li>
<li>
<div class="formCaption2">{tell:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{tell:body}<span class="formClr">{tell:validation}</span></div>
<div class="formDescription">{tell:description}</div>
</li>
<li>
<div class="formCaption2">{mobail:caption}<strong class="formRequired">(*)</strong></div>
<div class="formBody">{mobail:body}<span class="formClr">{mobail:validation}</span></div>
<div class="formDescription">{mobail:description}</div>
</li>
<li>
<div class="formCaption2">{fax:caption}<strong </strong></div>
<div class="formBody">{fax:body}<span class="formClr">{fax:validation}</span></div>
<div class="formDescription">{fax:description}</div>
</li>
<li>
<div class="formCaption2">{adres kar:caption}<strong </strong></div>
<div class="formBody">{adres kar:body}<span class="formClr">{adres kar:validation}</span></div>
<div class="formDescription">{adres kar:description}</div>
</li>
<li>
<div class="formCaption2">{adres manzel:caption}<strong </strong></div>
<div class="formBody">{adres manzel:body}<span class="formClr">{adres manzel:validation}</span></div>
<div class="formDescription">{adres manzel:description}</div>
</li>
</fieldset>
<fieldset id="information">
<legend>-</legend>
<li>
<div class="formBody">{ok:body}<span class="formClr">{ok:validation}</span></div>
</li>
</ol>
</fieldset>
</fieldset>
دیدن لینک ها برای شما امکان پذیر نیست. لطفا
ثبت نام کنید یا
وارد حساب خود شوید تا بتوانید لینک ها را ببینید.