smf 2.1 deki iconları smf 2.0 uygulama

Başlatan snrj, 01 Oca 2017 01:41

« önceki - sonraki »

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

*

  1. 3,077

  2. 584

  3. 960

bildiğiniz gibi smf 2.1 de iconlar css sprite şeklinde geliyor bunu smf 2.0 kısaca uygulama mantığını anlatmaya çalışacam
öncelikle ekteki resimi temamızın images klasörüne atalım yani bu resimi
[attach name=generic_icons.png type=image/png]1118[/attach]

sonra temamızın index.css dosyasında en alta şu kısımı ekleyelim

/* Some lovely generic icons.
------------------------------------------------- */
.generic_icons {
width: 16px;
height: 16px;
display: inline-block;
background: url(../images/generic_icons.png) no-repeat -5px -5px;
vertical-align: middle;
}
/* Small fix for topics */
.quickbuttons span.generic_icons {
margin: -3px 3px 0 1px;
}
.quickbuttons span.generic_icons.quote,
.quickbuttons span.generic_icons.quote_selected {
margin: -8px 3px 0 0;
}

.generic_icons.gender_None {
background: none;
}
/* This is a small fix for dropmenu icons */
.dropmenu .generic_icons, #profile_menu .generic_icons, .dropmenu img {
margin: -3px 8px 0 0;
vertical-align: middle;
}

/* Top row */
.generic_icons.help {
background-position: -5px -5px;
}
.generic_icons.search, .generic_icons.engines {
background-position: -31px -5px;
}
.generic_icons.quick_edit_button, .generic_icons.modify_button {
background-position: -57px -5px;
}
.generic_icons.check {
background-position: -83px -5px;
}
.generic_icons.invalid {
background-position: -109px -5px;
}
.generic_icons.gender_Female {
background-position: -135px -5px;
}
.generic_icons.watch {
background-position: -239px -5px;
}
/* 2nd row */
.generic_icons.move, .generic_icons.next_page {
background-position: -5px -31px;
}
.generic_icons.general, .generic_icons.boards, .generic_icons.topics_views {
background-position: -31px -31px;
}
.generic_icons.gender_Male {
background-position: -57px -31px;
}
.generic_icons.features {
background-position: -83px -31px;
}
.generic_icons.posters {
background-position: -109px -31px;
}
.generic_icons.replies, .generic_icons.topics_replies {
background-position: -135px -31px;
}
.generic_icons.history, .generic_icons.time_online, .generic_icons.scheduled {
background-position: -161px -31px;
}
.generic_icons.views {
background-position: -187px -31px;
}
.generic_icons.last_post {
background-position: -213px -31px;
}
.generic_icons.starters, .generic_icons.people, .generic_icons.membergroups, .generic_icons.mlist {
background-position: -239px -31px;
}
/* 3rd Street Saints */
.generic_icons.poll {
background-position: -5px -57px;
}
.generic_icons.previous_page {
background-position: -31px -57px;
}
.generic_icons.inbox {
background-position: -57px -57px;
}
.generic_icons.www {
background-position: -83px -57px;
}
.generic_icons.exit, .generic_icons.logout {
background-position: -109px -57px;
}
.generic_icons.switch {
background-position: -135px -57px;
}
.generic_icons.replied, .generic_icons.send {
background-position: -161px -57px;
}
.generic_icons.im_on {
background-position: -187px -57px;
}
.generic_icons.im_off {
background-position: -213px -57px;
}
.generic_icons.split_desel {
background-position: -239px -57px;
}
/* 4th Row */
.generic_icons.split_sel {
background-position: -5px -83px;
}
.generic_icons.mail {
background-position: -31px -83px;
}
.generic_icons.warning_mute {
background-position: -57px -83px;
}
.generic_icons.alerts, .generic_icons.warn_button,
.generic_icons.warning_moderate {
background-position: -83px -83px;
}
.generic_icons.mail_new {
background-position: -109px -83px;
}
.generic_icons.drafts,
.generic_icons.reply_button,
.generic_icons.reply_all_button {
background-position: -135px -83px;
}
.generic_icons.warning_watch {
background-position: -161px -83px;
}
.generic_icons.calendar_export {
background-position: -187px -83px;
}
.generic_icons.calendar {
background-position: -213px -83px;
}
.generic_icons.calendar_modify {
background-position: -239px -83px;
}
/* 5th Row */
.generic_icons.plus {
background-position: -5px -109px;
}
.generic_icons.warning, .generic_icons.moderate {
background-position: -31px -109px;
}
.generic_icons.themes {
background-position: -57px -109px;
}
.generic_icons.support {
background-position: -83px -109px;
}
.generic_icons.liked_users, .generic_icons.liked_messages, .generic_icons.like {
background-position: -109px -109px;
}
.generic_icons.unlike {
background-position: -135px -109px;
}
.generic_icons.current_theme {
background-position: -161px -109px;
}
.generic_icons.stats {
background-position: -187px -109px;
}
.generic_icons.right_arrow {
background-position: -213px -109px;
}
.generic_icons.left_arrow {
background-position: -239px -109px;
}
/* 6th Row */
.generic_icons.smiley {
background-position: -5px -135px;
}
.generic_icons.server {
background-position: -31px -135px;
}
.generic_icons.ban, .generic_icons.ignore {
background-position: -57px -135px;
}
.generic_icons.boards  {
background-position: -83px -135px;
}
.generic_icons.regcenter {
background-position: -109px -135px;
}
.generic_icons.posts {
background-position: -135px -135px;
}
.generic_icons.sort_down {
background-position: -161px -135px;
}
.generic_icons.change_menu2, .generic_icons.sent {
background-position: -187px -135px;
}
.generic_icons.post_moderation_moderate {
background-position: -213px -135px;
}
.generic_icons.sort_up {
background-position: -239px -135px;
}
/* 7th Row */
.generic_icons.post_moderation_deny {
background-position: -5px -161px;
}
.generic_icons.post_moderation_attach {
background-position: -31px -161px;
}
.generic_icons.post_moderation_allow {
background-position: -57px -161px;
}
.generic_icons.personal_message {
background-position: -83px -161px;
}
.generic_icons.permissions, .generic_icons.register {
background-position: -109px -161px;
}
.generic_icons.paid {
background-position: -135px -161px;
}
.generic_icons.packages {
background-position: -161px -161px;
}
.generic_icons.filter {
background-position: -187px -161px;
margin: 0 5px 0 0;
}
.generic_icons.change_menu {
background-position: -213px -161px;
}
.generic_icons.package_ops {
background-position: -239px -161px;
}
/* 8th Row */
.generic_icons.reports {
background-position: -5px -187px;
}
.generic_icons.news {
background-position: -31px -187px;
}
.generic_icons.delete, .generic_icons.hide_popup, .generic_icons.prune, .generic_icons.remove_button {
background-position: -57px -187px;
}
.generic_icons.modifications {
background-position: -83px -187px;
}
.generic_icons.maintain, .generic_icons.admin {
background-position: -109px -187px;
}
.generic_icons.administration, .generic_icons.home {
background-position: -135px -187px;
}
.generic_icons.frenemy {
background-position: -161px -187px;
}
.generic_icons.attachment {
background-position: -187px -187px;
}
.generic_icons.lock,.generic_icons.login, .generic_icons.security {
background-position: -213px -187px;
}
.generic_icons.error, .generic_icons.disable {
background-position: -239px -187px;
}
/* 9th Row */
.generic_icons.languages {
background-position: -5px -213px;
}
.generic_icons.members_request {
background-position: -31px -213px;
}
.generic_icons.members_delete {
background-position: -57px -213px;
}
.generic_icons.members {
background-position: -83px -213px;
}
.generic_icons.members_watched {
background-position: -109px -213px;
}
.generic_icons.sticky {
background-position: -135px -213px;
}
.generic_icons.corefeatures, .generic_icons.settings, .generic_icons.manrules, .generic_icons.manlabels {
background-position: -161px -213px;
}
.generic_icons.calendar {
background-position: -187px -213px;
}
.generic_icons.logs {
background-position: -213px -213px;
}
.generic_icons.valid {
background-position: -239px -213px;
}
/* 10th Row */
.generic_icons.approve, .generic_icons.enable,
.generic_icons.approve_button,
.generic_icons.read_button {
background-position: -5px -239px;
}
.generic_icons.close {
background-position: -31px -239px;
}
.generic_icons.details {
background-position: -57px -239px;
}
.generic_icons.merge {
background-position: -83px -239px;
}
.generic_icons.folder {
background-position: -109px -239px;
}
.generic_icons.restore_button {
background-position: -135px -239px;
}
.generic_icons.split_button {
background-position: -161px -239px;
}
.generic_icons.unapprove_button,
.generic_icons.unread_button {
background-position: -187px -239px;
}
.generic_icons.quote, .generic_icons.quote_selected {
background-position: -213px -239px;
}
.generic_icons.notify_button {
background-position: -239px -239px;
}
/* Styles for (fatal) errors.
------------------------------------------------- */

şimdi html kodlarını bu http://smf.konusal.com/index.php?topic=655.0
 konumuzda daha önce vermiştim artık siteni istedğiniz kısmında o şekilde kullanılabilir ben menüye eklemeyi örnek olarak vereyim
index.template.php de bul

<span class="', isset($button['is_last']) ? 'last ' : '', 'firstlevel">', $button['title'], '</span>değiştir
<span class="', isset($button['is_last']) ? 'last ' : '', 'firstlevel"><span class="generic_icons ', $act, '"></span> ', $button['title'], '</span>tabi bu değişklikten osnra ufak bir css ayarı gerekecek index.css de bul
.dropmenu a span
{
display: block;
padding: 0 0 0 5px;
font-size: 0.9em;
}
değiştir
.dropmenu a span
{
display: inline-block;
padding: 0 0 0 5px;
font-size: 0.9em;
}


MENU ×