مرجع پارسی MyBB

مرجع پارسی MyBB > نسخه MyBB 1.8 > آموزش ها > آموزش تغییرات > [آموزش] تغییر آیکن دکمه ها به فونت اوسام
نسخه‌ی کامل: [آموزش] تغییر آیکن دکمه ها به فونت اوسام
شما درحال مشاهده‌ی نسخه‌ی متنی این صفحه می‌باشید. مشاهده‌ی نسخه‌ی کامل با قالب‌بندی مناسب.

firstboy000

۱۳۹۵/۵/۱۲، ۱۱:۳۸:۱۲ صبح
درود خدمت دوستان،
امروز با آموزش تغییر آیکن دکمه های پست بیت و... به فونت اوسام همراهتون هستیم.

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

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


اگر قالب شما از فونت اوسام استفاده نمیکنه
کنترل پنل مدیریت > قالب ها و پوسته ها > قالب ها > قالب مورد نظر > قالب های دسته بندی نشده > headerinclude ؛ تکه کد زیر رو پیدا کنید...
کد:
{$stylesheets}
زیرش این کد رو اضافه کنید:
کد:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
** اگر قالب شما از فونت اوسام استفاده میکرده مرحله فوق نیاز نیست.




دکمه های پست بیت:

قالب ها و پوسته ها > پوسته ها > پوسته مورد نظر > global.css ؛ کد زیر رو پیدا کنید...
کد:
.postbit_buttons > a:link,
.postbit_buttons > a:hover,
.postbit_buttons > a:visited,
.postbit_buttons > a:active {
display: inline-block;
padding: 2px 5px;
margin: 2px;
font-size: 11px;
background: #eee url(images/buttons_bg.png) repeat-x;
border: 1px solid #ccc;
color: #555;
}

.postbit_buttons > a:hover {
border-color: #bbb;
}

.postbit_buttons a span {
padding-left: 20px;
display: inline-block;
height: 16px;
background-image: url(images/buttons_sprite.png);
background-repeat: no-repeat;
}

.postbit_buttons a.postbit_find span {
background-position: 0 0;
}

.postbit_buttons a.postbit_reputation_add span {
background-position: 0 -20px;
}

.postbit_buttons a.postbit_email span {
background-position: 0 -40px;
}

.postbit_buttons a.postbit_website span {
background-position: 0 -60px;
}

.postbit_buttons a.postbit_pm span {
background-position: 0 -80px;
}

.postbit_buttons a.postbit_quote span {
background-position: 0 -100px;
}

.postbit_buttons a.postbit_multiquote span {
background-position: 0 -120px;
}

.postbit_buttons a.postbit_multiquote_on span {
background-position: 0 -140px;
}

.postbit_buttons a.postbit_edit span {
background-position: 0 -160px;
}

.postbit_buttons a.postbit_qdelete span {
background-position: 0 -180px;
}

.postbit_buttons a.postbit_qrestore span {
background-position: 0 -200px;
}

.postbit_buttons a.postbit_report span {
background-position: 0 -220px;
}

.postbit_buttons a.postbit_warn span {
background-position: 0 -240px;
}

.postbit_buttons a.postbit_purgespammer span {
background-position: 0 -540px;
}

.postbit_buttons a.postbit_reply_pm span {
background-position: 0 -260px;
}

.postbit_buttons a.postbit_reply_all span {
background-position: 0 -280px;
}

.postbit_buttons a.postbit_forward_pm span {
background-position: 0 -300px;
}

.postbit_buttons a.postbit_delete_pm span {
background-position: 0 -320px;
}
با کد زیر جابجاش کنید:
کد:
.postbit_buttons > a:link,
.postbit_buttons > a:hover,
.postbit_buttons > a:visited,
.postbit_buttons > a:active {
display: inline-block;
padding: 2px 5px;
margin: 2px;
font-size: 11px;
background: url("images/buttons_bg.png") repeat-x scroll 0% 0% #EEE;
  border: 1px solid #CCC;
color: #555;
}

.postbit_buttons > a:hover {
border-color: #bbb;
}

.postbit_buttons a span:before {
  content: "";
  display: inline-block;
  font-family: FontAwesome;
  font-weight: normal;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-left: 5px;
  font-size: 12px;
}

.postbit_buttons a.postbit_find span:before {
content: "\f002";
}

.postbit_buttons a.postbit_reputation_add span:before {
content: "\f067";
}

.postbit_buttons a.postbit_email span:before {
content: "\f0e0";
}

.postbit_buttons a.postbit_website span:before {
content: "\f0ac";
}

.postbit_buttons a.postbit_pm span:before {
content: "\f199";
}

.postbit_buttons a.postbit_quote span:before {
content: "\f10e";
}

.postbit_buttons a.postbit_multiquote span:before {
content: "\f055";
}

.postbit_buttons a.postbit_multiquote_on span:before {
content: "\f056";
  color: #DB1304;
}

.postbit_buttons a.postbit_edit span:before {
content: "\f044";
}

.postbit_buttons a.postbit_qdelete span:before {
content: "\f00d";
}

.postbit_buttons a.postbit_qrestore span:before {
content: "\f067";
}

.postbit_buttons a.postbit_report span:before {
content: "\f0a1";
}

.postbit_buttons a.postbit_warn span:before {
content: "\f0e3";
}

.postbit_buttons a.postbit_purgespammer span:before {
content: "\f071";
}

.postbit_buttons a.postbit_reply_pm span:before {
content: "\f112";
}

.postbit_buttons a.postbit_reply_all span:before {
content: "\f122";
}

.postbit_buttons a.postbit_forward_pm span:before {
content: "\f064";
}

.postbit_buttons a.postbit_delete_pm span:before {
content: "\f00d";
}

نمونه : [attachment=9964]



دکمه های دیگر:

قالب ها و پوسته ها > پوسته مورد نظر > global.css > کد زیر رو پیدا کنید...
کد:
a.button:link,
a.button:hover,
a.button:visited,
a.button:active {
background: #0f0f0f url(images/tcat.png) repeat-x;
color: #fff;
display: inline-block;
padding: 4px 8px;
margin: 2px 2px 6px 2px;
border: 1px solid #000;
font-size: 14px;
}

a.button.small_button {
font-size: 13px;
margin: 0;
padding: 3px 6px;
}

a.button span {
padding-left: 20px;
display: inline-block;
background-image: url(images/buttons_sprite.png);
background-repeat: no-repeat;
}

a.button.new_thread_button span {
background-position: 0 -340px;
}

a.button.new_reply_button span {
background-position: 0 -360px;
}

a.button.closed_button span {
background-position: 0 -380px;
}

a.button.rate_user_button span {
background-position: 0 -400px;
}

a.button.add_buddy_button span {
background-position: 0 -440px;
}

a.button.remove_buddy_button span {
background-position: 0 -480px;
}

a.button.add_ignore_button span {
background-position: 0 -460px;
}

a.button.remove_ignore_button span {
background-position: 0 -500px;
}

a.button.report_user_button span {
background-position: 0 -520px;
}
با کد زیر جابجاش کنید:
کد:
a.button:link,
a.button:hover,
a.button:visited,
a.button:active {
background: #0f0f0f url(images/tcat.png) repeat-x;
color: #fff;
display: inline-block;
padding: 4px 8px;
margin: 2px 2px 6px 2px;
border: 1px solid #000;
font-size: 14px;
}

a.button.small_button {
font-size: 13px;
margin: 0;
padding: 3px 6px;
}

a.button span:before {
  content: "";
  display: inline-block;
  font-family: FontAwesome;
  font-weight: normal;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-left: 5px;
}

a.button.new_thread_button span:before {
content: "\f086";
}

a.button.new_reply_button span:before {
content: "\f075";
}

a.button.closed_button span:before {
content: "\f00d";
}

a.button.rate_user_button span:before {
content: "\f123";
}

a.button.add_buddy_button span:before {
content: "\f007";
}

a.button.remove_buddy_button span:before {
content: "\f00d";
}

a.button.add_ignore_button span:before {
content: "\f1f6";
}

a.button.remove_ignore_button span:before {
content: "\f0f3";
}

a.button.report_user_button span:before {
content: "\f0a1";
}

نمونه : [attachment=9965]


منبع: http://community.mybb.com/thread-161611.html
مرجع پارسی MyBB > نسخه MyBB 1.8 > آموزش ها > آموزش تغییرات > [آموزش] تغییر آیکن دکمه ها به فونت اوسام