آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

**EbiramGs** · 12-11-2009 04:11

سلام خدمت دوستان گرامی و وی بی کاران عزیز!!!

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

خب برای شروع کار باید بگم اگه با html و کد های مربوط به تیبل ها (table) آشنایی ندارید حتما قبلش تو این زمینه مطالعه کنید تا در حین آموزش دچار مشکل نشید...لازمه بگم که تمام قالب های وی بی رو با همین کد های تیبل می نویسن...

برای شروع کار از آشنایی با قسمت های مختلف یک استایل آشنا میشیم:

برای این کار اول به admincp برید و بعد از وارد شدن به صفحه اصلی مدیریت روی تب استایل ها & قالب ها کلیک کنید تا پنل گزینه هاش باز بشه،بعد تنظیمات استایل رو انتخاب کنید تا به صفحه مورد نظرمون بریم.

بعد از باز شدن صفحه تنظیمات استایل،یه لیست از تمام استایل های نصب شده روی فرومتون هست که میشه برای هرکدوم تنظیمات خاص خودشو انجام داد،اما ما اینجا برای ایجاد یه قالب درست و بدون نقض از همون قالب اصلی انجمن استفاده می کنیم (Default Style).

برای آشنایی با خصوصیات و اجزای عمومی و جلوه های گرافیکی قالب روی کلید برو مخصوص قالب اصلی کلیک کنید تا وارد صفحه تنظیمات بشید:

بعد از ورود به صفحه تنظیمات با چندین گزینه مواجه میشید که هر کدومو اینجا یکی یکی معرفی می کنم و شرح میدم...

ادامه دارد.............................

**Behr@d** · 12-15-2009 16:49

سلام
اگر هستی یه لحظه بیا سایتم
قالب TopForum! رو ببین

**EbiramGs** · 12-15-2009 17:04

خب دیدم بهراد جان مشکلی که نداره؟؟؟؟؟!!!!!!

**Behr@d** · 12-15-2009 17:07

با موزیلا درسته با اینترینت اکپلورر ببینید

**EbiramGs** · 12-15-2009 17:20

بهراد جان شما کد ها رو ممکنه اشتباه تغییر داده باشی چون فروم من توی آی ای مشکلی نداره و از همین کد ها استفاده می کنه...

شما کد ها رو از نو جاگذاری کن:

کد:

<tr align="center">
    <td class="alt2"><img src="$stylevar[imgdir_statusicon]/$forum[imageprefix]forum_$forum[statusicon].gif" alt="" border="0" id="forum_statusicon_$forum[forumid]" /></td>
    <td class="alt1Active" align="$stylevar[left]" id="f$forum[forumid]">
        <div>
            <a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]"><strong>$forum[title]</strong></a>
            <if condition="$show['browsers']"><span class="smallfont">(<phrase 1="$forum[browsers]">$vbphrase[x_viewing]</phrase>)</span></if>
        </div>
        <if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>
        <if condition="$show['forumsubscription']"><div class="smallfont"><strong><a href="subscription.php?$session[sessionurl]do=removesubscription&amp;f=$forum[forumid]" rel="nofollow">$vbphrase[unsubscribe_from_this_forum]</a></strong></div></if>
        <if condition="$show['subforums']"><div class="smallfont" style="margin-top:$stylevar[cellpadding]px"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
    </td>
    <td class="alt2" nowrap="nowrap" width="300">$forum[lastpostinfo]</td>
    <td class="alt1" width="40">$forum[threadcount]</td>
    <td class="alt2" width="40">$forum[replycount]</td>
    <if condition="$vboptions['showmoderatorcolumn']">
    <td class="alt1" width="120"><div class="smallfont">$forum[moderators]&nbsp;</div></td>
    </if>
</tr>
$childforumbits

**Behr@d** · 12-15-2009 17:47

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

forum home:$stylevar[htmldoctype]
<html xmlns="http://www.w3.org/1999/xhtml" dir="$stylevar[textdirection]" lang="$stylevar[languagecode]">
<head>

<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="-1" />
<meta http-equiv="cache-control" content="no-cache" />

$headinclude
<title><phrase 1="$vboptions[bbtitle]">$vbphrase[x_powered_by_vbulletin]</phrase></title>
</head>
<body>
$header
$navbar

<if condition="$show['guest']">

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>
<td class="tcat"><phrase 1="$vboptions[bbtitle]">$vbphrase[welcome_to_the_x]</phrase></td>
</tr>
<tr>
<td class="alt1">
<phrase 1="faq.php$session[sessionurl_q]" 2="register.php$session[sessionurl_q]">$vbphrase[first_visit_message]</phrase>
</td>
</tr>
</table>

<br />
</if>


<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
$forumbits
<tbody>
<tr>
<td class="tfoot" align="center" colspan="<if condition="$vboptions['showmoderatorcolumn']">6<else />5</if>"><div class="smallfont"><strong>
<a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
<if condition="$vboptions['forumleaders']">   
<a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if>
</strong></div></td>
</tr>
</tbody>
</table>
$forumhome_markread_script


<br />
$ad_location[ad_forumhome_afterforums]
<br />


<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
<tr>
<td class="tcat" colspan="2">$vbphrase[whats_going_on]</td>
</tr>
</thead>
$template_hook[forumhome_wgo_pos1]
<if condition="$show['loggedinusers']">

<tbody>
<tr>
<td class="thead" colspan="2">
<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumhome_activeusers')"><img id="collapseimg_forumhome_activeusers" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_forumhome_activeusers].gif" alt="" border="0" /></a>
<a href="online.php$session[sessionurl_q]">$vbphrase[currently_active_users]</a>: $totalonline (<phrase 1="$numberregistered" 2="$numberguest">$vbphrase[x_members_and_y_guests]</phrase>)
</td>
</tr>
</tbody>
<tbody id="collapseobj_forumhome_activeusers" style="$vbcollapse[collapseobj_forumhome_activeusers]">
<tr>
<td class="alt2"><a href="online.php$session[sessionurl_q]"><img src="$stylevar[imgdir_misc]/whos_online.gif" alt="$vbphrase[view_whos_online]" border="0" /></a></td>
<td class="alt1" width="100%">
<div class="smallfont">
<div style="white-space: Nowrap"><phrase 1="$recordusers" 2="$recorddate" 3="$recordtime">$vbphrase[most_users_ever_online_was_x_y_at_z]</phrase></div>
<div>$activeusers</div>
</div>
</td>
</tr>
</tbody>

</if>
$template_hook[forumhome_wgo_pos2]
<tbody>
<tr>
<td class="thead" colspan="2">
<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumhome_stats')"><img id="collapseimg_forumhome_stats" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_forumhome_stats].gif" alt="" border="0" /></a>
<phrase 1="$vboptions[bbtitle]">$vbphrase[x_statistics]</phrase>
</td>
</tr>
</tbody>
<tbody id="collapseobj_forumhome_stats" style="$vbcollapse[collapseobj_forumhome_stats]">
<tr>
<td class="alt2"><img src="$stylevar[imgdir_misc]/stats.gif" alt="<phrase 1="$vboptions[bbtitle]">$vbphrase[x_statistics]</phrase>" border="0" /></td>
<td class="alt1" width="100%">
<div class="smallfont">
<div>
$vbphrase[threads]: $totalthreads,
$vbphrase[posts]: $totalposts,
$vbphrase[members]: $numbermembers<if condition="$show['activemembers']">,
<span title="<phrase 1="$vboptions[activememberdays]">$vbphrase[within_the_last_x_days]</phrase>">$vbphrase[active_members]: $activemembers</span>
</if>
</div>
<div><phrase 1="member.php?$session[sessionurl]u=$newuserid" 2="$newusername">$vbphrase[welcome_to_our_newest_member_x]</phrase></div>
$template_hook[forumhome_wgo_stats]
</div>
</td>
</tr>
</tbody>
$template_hook[forumhome_wgo_pos3]
<if condition="$show['birthdays']">

<tbody>
<tr>
<td class="thead" colspan="2">
<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumhome_birthdays')"><img id="collapseimg_forumhome_birthdays" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_forumhome_birthdays].gif" alt="" border="0" /></a>
$vbphrase[todays_birthdays]
</td>
</tr>
</tbody>
<tbody id="collapseobj_forumhome_birthdays" style="$vbcollapse[collapseobj_forumhome_birthdays]">
<tr>
<td class="alt2"><a href="calendar.php?$session[sessionurl]do=getday&day=$today&sb=1"><img src="$stylevar[imgdir_misc]/birthday.gif" alt="$vbphrase[view_birthdays]" border="0" /></a></td>
<td class="alt1" width="100%"><div class="smallfont">$birthdays</div></td>
</tr>
</tbody>

</if>
$template_hook[forumhome_wgo_pos4]
<if condition="$show['upcomingevents']">
<tbody>
<tr>
<td class="thead" colspan="2">
<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumhome_events')"><img id="collapseimg_forumhome_events" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_forumhome_events].gif" alt="" border="0" /></a>
<if condition="$show['todaysevents']">$vbphrase[todays_events]<else /><phrase 1="$vboptions[showevents]">$vbphrase[upcoming_events_for_the_next_x_days]</phrase></if>
</td>
</tr>
</tbody>
<tbody id="collapseobj_forumhome_events" style="$vbcollapse[collapseobj_forumhome_events]">
<tr>
<td class="alt2"><a href="calendar.php$session[sessionurl_q]"><img src="$stylevar[imgdir_misc]/calendar.gif" alt="$vbphrase[calendar]" border="0" /></a></td>
<td class="alt1" width="100%"><div class="smallfont">$upcomingevents</div></td>
</tr>
</tbody>
</if>
$template_hook[forumhome_wgo_pos5]
</table>
<br />



<table cellpadding="0" cellspacing="2" border="0" width="100%">
<tr valign="bottom">
<td>
<table cellpadding="2" cellspacing="0" border="0">
<tr>
<td><img src="$stylevar[imgdir_statusicon]/forum_new.gif" alt="$vbphrase[contains_new_posts]" border="0" /></td>
<td class="smallfont">  $vbphrase[forum_contains_new_posts]</td>
</tr>
<tr>
<td><img src="$stylevar[imgdir_statusicon]/forum_old.gif" alt="$vbphrase[contains_no_new_posts]" border="0" /></td>
<td class="smallfont">  $vbphrase[forum_contains_no_new_posts]</td>
</tr>
<if condition="$vboptions['showlocks']">
<tr>
<td><img src="$stylevar[imgdir_statusicon]/forum_old_lock.gif" alt="$vbphrase[a_closed_forum]" border="0" /></td>
<td class="smallfont">  $vbphrase[forum_is_closed_for_posting]</td>
</tr>
</if>
</table>
</td>
<if condition="!$show['guest']">

<td align="$stylevar[right]"><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')"><phrase 1="$bbuserinfo[username]">$vbphrase[log_out_x]</phrase></a></td>

</if>
</tr>
</table>


$footer
</body>
</html>

forumhome_forumbit_level1_nopost:<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tbody>
<tr>
<td class="tcat" colspan="<if condition="$vboptions[showmoderatorcolumn]">6<else />5</if>">
<if condition="$childforumbits">
<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumbit_$forumid')"><img id="collapseimg_forumbit_$forumid" src="$stylevar[imgdir_button]/collapse_tcat{$collapseimg_forumid}.gif" alt="" border="0" /></a>
</if>
<a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]">$forum[title]</a>
<if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>
<if condition="$show['subforums']"><div class="smallfont"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
</td>
</tr>
</tbody>
<if condition="$childforumbits">
<tbody id="collapseobj_forumbit_$forumid" style="{$collapseobj_forumid}">
<tr align="center">
<td class="thead" width="35"> </td>
<td class="thead" align="$stylevar[left]">$vbphrase[forum]</td>
<td class="thead" width="300">$vbphrase[last_post]</td>
<td class="thead" width="40">$vbphrase[thread]</td>
<td class="thead" width="40">$vbphrase[post]</td>
<if condition="$vboptions['showmoderatorcolumn']">
<td class="thead" width="120">$vbphrase[moderator]</td>
</if>
</tr>
$childforumbits
</tbody>
</if>
</table>
<div style="padding:0px 0px 16px 0px;"></div>

forumhome_forumbit_level2_post:<tr align="center">
<td class="alt2"><img src="$stylevar[imgdir_statusicon]/$forum[imageprefix]forum_$forum[statusicon].gif" alt="" border="0" id="forum_statusicon_$forum[forumid]" /></td>
<td class="alt1active" align="$stylevar[left]" id="f$forum[forumid]">
<div>
<a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]"><strong>$forum[title]</strong></a>
<if condition="$show['browsers']"><span class="smallfont">(<phrase 1="$forum[browsers]">$vbphrase[x_viewing]</phrase>)</span></if>
</div>
<if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>
<if condition="$show['forumsubscription']"><div class="smallfont"><strong><a href="subscription.php?$session[sessionurl]do=removesubscription&f=$forum[forumid]" rel="nofollow">$vbphrase[unsubscribe_from_this_forum]</a></strong></div></if>
<if condition="$show['subforums']"><div class="smallfont" style="margin-top:$stylevar[cellpadding]px"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
</td>
<td class="alt2" nowrap="nowrap" width="300">$forum[lastpostinfo]</td>
<td class="alt1" width="40">$forum[threadcount]</td>
<td class="alt2" width="40">$forum[replycount]</td>
<if condition="$vboptions['showmoderatorcolumn']">
<td class="alt1" width="120"><div class="smallfont">$forum[moderators] </div></td>
</if>
</tr>
$childforumbits

خودتون ببینید

**EbiramGs** · 12-15-2009 18:20

شما باید اول استایلو کاملا از نظر css ویرایش کنی و بعد بگی مشکل داره یا نه...اول تمام تغییرات css رو اعمال کن و بعد ببین چی میشه...

مشکل می تونه از عکس های فروم باشه...

شما اول یه انجمن روی لوکال نصب کن بدون اینکه هیچ تغییری تو استایل بدی،بعد کد ها رو جاگذاری کن و ببین چی میشه...

**EbiramGs** · 12-17-2009 00:43

برای اینکه دوستان راحت بتونن با وی بی استایل درست کنن من یه استایل آماده کردم که شکل جدیدی برای نمایش تعداد موضوعات و پاسخ به موضوعات و نمایش موضوعات داره که توی شکل کاملا معلومه،من تغییراتی روی عکس های استایل ندادم که دوستان خودشون این کارو اگه خواستن بکنن...

امیدوارم مورد استفاده قرار بگیره و خوشتون بیاد...

برای تماس با من دوستان می تونن از فایل readme.txt آدرس ایمیل و سایت منو داشته باشن...

اگه سوالی بود بپرسید...

موفق باشید!!!

**tofane69** · 12-17-2009 07:09

با تشکر از شما دوست عزیزم
به نظرم بهتره یه تاپیک پرسش و پاسخ ایجاد کن و هر کس سوالی داره اونجا بیان کنه این تاپیک از حالت آموزشی خئدش خارج نشه
دوست من اقلب دوستان فارسی سازی قالب مد نظرشونه تا طراحیش
البته من نمیگم کسی دنبال طراحی نیست
اما اگه فارسی کردن قالب و نحوه ی rtl کردن قالب رو برامون از اول آموزش بدی در کنار این تاپیک (البته اگه تاپیکش جدا باشه بهتره) ادلمه بدی خیلی از مشکلات و سوالات ما رو حل کردی
خدا خیرت بده داداش

**EbiramGs** · 12-17-2009 12:38

ممنون دوست گرامی باشه سعی می کنم تو آموزش بعدی نحوه فارسی کردن قالب هم بگم براتون...

**EbiramGs** · 12-17-2009 13:33

آموزش فارسی کردن یک استایل انگلیسی،نمونه:Orange Grove

نحوه rtl کردن استایل های وی بی شاید آسونترین کاری باشه که ما می تونید انجام بدیم چون نیازی به css نویسی نداره معمولا و به راحتی با تغییر عکس ها میشه اونو فارسی کرد.

من اینجا روی استایل Orange Grove کار می کنم که شما توی انجمن استایل انگلیسی های همین سایت می تونید دان کنید...

خب بعد از نصب قالب و نمایش انجمن با اون قالب می شه دید که انجمن برعکس شده یعنی خودش rtl شده و فقط از نظر تصویری به هم ریخته که بهتون میگم چطور درستش کنید...
وقتی فایل زبان انجمنو نصب کنید یه گزینه داره که نوشته از چب به راست و از راست به چپ،این همون rtl هست که ما نیازش داریم پس معمولا نیازی به تغییر css نیست،اما اگه دوستان با کاری که گفتم و انجام دادن نتونستن یه قالبو فارسی کنن نام قالبو بگن تا براشون آموزش بزارم...

برای فارسی کردم قالب Orange Grove ما فقط به برنامه فتوشاپ نیاز داریم،قالبو روی لوکال نصب کنید،و شروع کنید:

به پوشه images برید و پوشه orange_g رو باز کنید تا به عکس های استایل دسترسی داشته باشید.

اول به پوشه gradients برید و اونجا فایل های تصویری فروم مشاهده میشه،ما دوتا راه برای تنظیم قالب داریم:

1.با فتوشاپ عکس ها رو rtl کنیم
2.نام فایل هایی که برای قسمت راست فروم هست رو به نام فایل های قسمت چپ انجمن تغییر بدیم.

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

خب ابتدا راه اولو یه نمونه میگم و بعد را دوم:

مثلا فایل عکس با نام navb_left.png رو با فتوشاپ باز کنید،و بعد :

از منوی لایه های فتوشاپ روی لایه Layer 0 دوبار کلیک کنید تا لایه از حالت قفل دربیاد و بعد ابزار move tool فتوشاپ یا همون ابزاری که نمادش عکس یه موس سیاه رنگه که بالاترین نقطه جعبه ابزار هستو انتخاب کنید و از منوی بالای صفحه تیک

auto select و show transform contorols رو فعال کنید و حالا روی عکس با ابزار move tool کلیک کنید تا مربع های کنترل دور عکس ظاهر بشن و روی یکی از مربع ها فقط یه کلیک چپ کنید تا منوی بالا گزینه های ارتفاع و عرض تصویر رو به ما نشون بده و فقط یه منفی پشت عدد خاصیت عرض تصویر قرار بدید و تصویرو با نام خودش سیو کنید

انجمنو از نو لود کنید و تغییرات و ببینید.

روش دوم هم که تقریبا همه بلدن فقط شما باید نام تصاویر چپ و راست رو با هم عوض کنید همین....

اگه مشکلی بود بپرسید...

موضوع: آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

LinkBack

ابزارهای موضوع

نحوه نمایش موضوع

آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

49 کاربر از پست مفید EbiramGs سپاس کرده اند .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید Behr@d سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید EbiramGs سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید Behr@d سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید EbiramGs سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید Behr@d سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

2 کاربر از پست مفید EbiramGs سپاس کرده اند .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

3 کاربر از پست مفید EbiramGs سپاس کرده اند .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

2 کاربر از پست مفید tofane69 سپاس کرده اند .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

کاربر روبرو از پست مفید EbiramGs سپاس کرده است .

پاسخ : آموزش کامل طراحی و ساخت قالب برای ویبولتین(همه ورژن ها)

8 کاربر از پست مفید EbiramGs سپاس کرده اند .

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

موضوعات مشابه

آموزش ایجاد فیلد مشخصات برای نمایش تصویر در پست بیت در ویبولتین ورژن 4 ( نمایش تیم فوتبال ، موبایل ، سیم کارت ، غیره )

آموزش ویدیوی نصب ویبولتین بر روی هاست همراه با نصب فارسی ساز

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

نظر سنجی در خصوص بخش آموزشی ویبولتین ویدیو و تصویر

آموزش ویدیوی فارسی سازی استایل های ویبولتین ورژن 4 توسط وی بی اسکین vbskin.ir

کاربران خواننده این موضوع : 586

کلمات کلیدی این موضوع

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش