آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد

آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - نسخه‌ی قابل چاپ

+- مرجع پارسی MyBB (https://community.mybbiran.com)
+-- انجمن: آرشیو (https://community.mybbiran.com/forum-128.html)
+--- انجمن: آرشیو انجمن های قدیمی (https://community.mybbiran.com/forum-129.html)
+---- انجمن: مای بی بی نسخه 1.6 (https://community.mybbiran.com/forum-83.html)
+----- انجمن: آموزش ها (https://community.mybbiran.com/forum-84.html)
+------ انجمن: سایر آموزش ها (https://community.mybbiran.com/forum-114.html)
+------ موضوع: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد (/thread-15415.html)

صفحه‌ها: 1 2 3 4 5

آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - صالح غلامیان - ۱۳۹۲/۹/۱۵

درود

[تصویر: photos.png]

نمونه:

بروید

کنترول پنل مدیر کل>>> قالب ها و پوسته ها>>> پوسته ها >>> پوسته ی مورد نظر >>>global.css

کدهای زیر را در انتها اضافه کنید و سپس ذخیره کنید

کد php: 
#best_box {
    margin-bottom: -10px;
    margin-top: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
padding: 12px;
text-align: center;
height: 120px;
}
.beststop {
position: absolute;
background: url(images/beststop.png) no-repeat;
height: 39px;
width: 190px;
right: 50px;
margin-top: -15px
}
.beststop span {
    position: absolute;
    font: 16px Byekan;
    color: white;
    text-shadow: 1px 1px #484848;
    right: 47px;
    top: 4px;
}
.beststop2 {
position: absolute;
background: url(images/beststop.png) no-repeat;
height: 39px;
width: 190px;
left: 50px;
margin-top: -15px
}
.beststop2 span {
    position: absolute;
    font: 16px Byekan;
    color: white;
    text-shadow: 1px 1px #484848;
    left: 47px;
    top: 4px;
}
.bestuser {
border: 1px solid #ccc;
background:rgba(255,255,255,0.6);
overflow: hidden;
height: 125px;
width: 25%;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
float: right;
}
.bestuseravatar {
height: 104px;
width: 80px;
border: 1px solid gray;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
float: left;
margin-left: 8px;
margin-top: 9px;
}
.bestusertext {
font: 16px Byekan;
line-height: 8px;
margin-top: 30px;
}
.bestusertext span{
font: 16px Byekan;
background: url(images/bestusericon.png) no-repeat right;
padding: 1px 10px;
padding-right: 28px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border: 1px solid #a7a7a7;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
}
.bestusertext span:hover{
    background: url(images/bestusericonoff.png) no-repeat right;
}
.bestusertext a {
color: #177ea7;
text-decoration: none;
}
.wikitopiks {
border: 1px solid #ccc;
background:rgba(255,255,255,0.6);
overflow: hidden;
height: 125px;
width: 73%;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
float: left;
}
.wikitopikstext span{
font: 13px Byekan;
color: #11aae0;
background: url(images/staron.png) no-repeat right;
padding: 5px 10px;
padding-right: 28px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border: 0px solid #d1d1d1;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
}
.wikitopikstext span:hover{
   background: url(images/staroff.png) no-repeat right;
   color: gray;
}
.wikitopikstext {
height: 8px;
margin-top: 25px;
margin-right: 20px;
margin-left: 20px;
} 

اکنون بروید
کنترول پنل مدیر کل >>> قالب ها و پوسته ها >>> قالب ها >>> قالب مورد نظر >>> Navigation Templates >>> سپس nav

حال کد های زیر را در ابتدا اضافه کنید و سپس ذخیر کنید

کد: 
<!--box bests start-->

<div id="best_box">

<div class="bestuser" title="به صورت ماهیانه در این سایت نظرسنجی ایجاد میشود و برترین کاربر ماه انتخاب شده و مشخصات کاربر در این قسمت به عنوان هدیه به مدت یکماه یعنی تا انتخاب کاربر برتر ماه آینده قرار میگیرد . شما هم میتوانید کاربر برتر باشید">

<div class="beststop"><span>برترین کاربر ماه</span></div>

<div class="bestuseravatar"><a href="http://mybbiran.com"><img src="http://www.wikivb.ir/avatars/member4.gif" alt="مای بی بی" height="104px" width="80px" /></a></div>

<div class="bestusertext">

<center><a href="http://mybbiran.com" ><span style="font-family:Arial;font-weight: bold;padding-top: 4px;padding-bottom: 4px;color:#0024ff">saleh</span></a></center>

<br/>

<center><span>مدیر بخش</span></center>

<br/>

<center><a href="http://mybbiran.com" target="blank"><span>وبسایت</span></a></center>

</div>

</div>

<div class="wikitopiks">

<div class="beststop2"><span>تاپیکهای کارآمد</span></div>

<div class="wikitopikstext">

<table width="100%" border="0">

<tr>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 1</span></a></td>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 2</span></a></td>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 3</span></a></td>

</tr>

</table>

</div>

<div class="wikitopikstext">

<table width="100%" border="0">

<tr>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 4</span></a></td>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 5</span></a></td>

<td width="35%"><a href="http://mybbiran.com" ><span style="float: right;">تاپیکهای کارآمد 6</span></a></td>

</tr>

</table>

</div>

</div>

</div>

<!--box bests end-->

اکنون تصاویر پیوست را در فولدر images آپلود کنید ( پیوست شود)

دانلود پیوست

-------------
برای تغییرات هم باید کدهایی که به Navigation اضافه کردید را ویرایش کنید

موفق باشید

برگرفته از: ویکی ویبی

RE: آموزش ایجاد باکس کابر برتر و تاپیک های برتر ماه - محمد تی ام - ۱۳۹۲/۹/۱۵

دنبالش بودم ممنون Heart

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - Amin Yaghubi - ۱۳۹۲/۹/۱۵

(۱۳۹۲/۹/۱۵، ۲۱:۰۵:۴۴ عصر)محمد تی ام نوشته است: دنبالش بودم ممنون

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

با تشکر

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - SAEED.M - ۱۳۹۲/۱۰/۱

سلام دوستان ...

مشکلی که دارم اینه این باکس تنها با فارفاکس ست هست و در دیگر مرورگرها مثل کروم بصورت بهم ریخته نشون داده میشه !
چجوری میتونم با دیگر مرورگر ها هم ستش کنم ؟؟

سپاس بابت این باکس زیبا Wink

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - محمد تی ام - ۱۳۹۲/۱۰/۱

من که با مرورگر کروم هستم مشکلی نیس

البته کش تو پاک کن اول بعد چک کن

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - firstboy000 - ۱۳۹۲/۱۰/۱

منم تائید میکنم با کروم هستم.اگر ورژن کرومتون قدیمیه آپدیت کنید.

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - SAEED.M - ۱۳۹۲/۱۰/۱

یعنی قبل از اینکه این ارسالو بذارم دو سه بار کشو پاک کردم هیچ فرقی نکرد تا الان شما گفتی دوباره زدم تغییر کرد Sad

این از راز های اینترنته Smile

مرررسی درست شد Wink

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - Gh-Moradi - ۱۳۹۲/۱۰/۴

سلام صالح جان

دستت درد نکنه بابت این باکس زیبا ، حالا من میخوام به جای تصویر کاربر ماه آواتار خود شخص نمایش داده شود ولی هرکاری میکنم نمیشه ، متغییر آواتار هم گذاشتم ولی نمایش داده نمیشه ، چرا؟
اصلا میشه آواتار در صفحه اصلی نمایش داده بشه؟

داداش صالح هم اکنون نیازمند یاری سبزتان هستیم Blush

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - K@Z3M - ۱۳۹۲/۱۰/۴

میتونین از این کد استفاده کنید :

کد php: 
<img src="{$mybb->user['avatar']}" > 

RE: آموزش ایجاد باکس کابر برتر و تاپیک های کار آمد - firstboy000 - ۱۳۹۲/۱۰/۲۰

قسمت کاربر برتر داینامیک نمیشه؟فقط به صورت دستی باید وارد کنی؟
کسی داینامیکش رو نداره؟

یا مثلا یه طوری باشه که آی دی کاربر رو وارد کنی و خودش بقیه چیزاشو درست کنه؟