• Derecelendirme: 0/5 - 0 oy
  • 5
  • 4
  • 3
  • 2
  • 1
Gösterim Stili

fa fa-icon kodları yerine kendi sunucumdan icon çağırma nasıl yaparım?
#1

Merhabalar, iyinet sakinleri Başlığı şimdi detaylı ve resimlerle destekleyerek anlatacağım. Lütfen bilgisi olan yardımcı olsun. 

Mythemeshop - Sensational isimli tema wordpress tabanlı sitemde kurulu. Siteyi yayına açmam için son bir kaç adım kalmıştı ki. %50 60lık bir css bilgimle çözüm üretemediğim bir sorunla karşılaştım. Kısaca anlatmak gerekirse resimde gösterdiğim alan da fa fa-facebook örneğin kod var kodu da paylaşacağım ben bu kodu style.css içinden kendi klasorlerimde bulunan kendi yüklediğim ikonlarla değiştirmek istiyorum. Mesela ben sabah gazetesine buton koyacağım o buton için sabah ikonunu düzenleyip sunucuma yükleyeceğim sadece ikonu nasıl çağıracağım yardımcı olursanız sevinirim.

Resim
1GMPgN.png

style.css

Kod:
/*-[ Social Profile Widget ]--------------------------*/
.social-profile-icons ul {
    margin-left: -5px;
    margin-right: -5px;
    overflow: hidden;
}
.social-profile-icons ul li {
    background: none;
    border: none;
    float: left;
    list-style-type: none;
    margin: 0 5px 10px 5px!important;
    padding: 0 !important;
    border: none !important;
}
#sidebar-left .social-profile-icons ul li { 
    width: auto;
    margin: 0 4px 5px 4px!important; 
}
.social-profile-icons ul li a {
    width: 34.2px;
    height: 34.2px;
    display: block;
    float: left;
    border-radius: 3px;
    text-align: center;
    line-height: 34.2px;
    color: #FFF!important;
    transition: all .4s;
    padding: 0;
}
.sidebar .social-profile-icons ul li a:hover {
    color: #fff;
    background: #666;
}
.sidebar .social-profile-icons ul li a { color: #fff }
.social-profile-icons ul li i {
    font-size: 16px;
    line-height: 32px;
}
.social-profile-icons .social-facebook a { background: #5d82d1 }
.social-profile-icons .social-twitter a { background: #40bff5 }
.social-profile-icons .social-instagram a { background: #91653f }
.social-profile-icons .social-youtube a { background: #c9322b }
.social-profile-icons .social-gplus a { background: #eb5e4c }
.social-profile-icons .social-fbgrubu a { background: #ef922f }
.social-profile-icons .social-bloomberg a { background: #35c6ea }
.social-profile-icons .social-ntveko a { background: #f7659c }
.social-profile-icons .social-ekodialog a { background: #426d9b }
.social-profile-icons .social-sabaheko a { background: #ff48a3 }
.social-profile-icons .social-hteko a { background: #e13138 }
.social-profile-icons .social-aaekonomi a { background: #238cc8 }
.social-profile-icons .social-onedio a { background: #b5a470 }
.social-profile-icons .social-mynet a { background: #1d90dd }
.social-profile-icons .social-pazarlamasyon a { background: #1879fd }
.social-profile-icons .social-bbceko a { background: #13c1f3 }
.social-profile-icons .social-bigpara a { background: #ff7e30 }
.social-profile-icons .social-ebakanlik a { background: #ff5c30 }
.social-profile-icons .social-capital a { background: #3476e4 }
.social-profile-icons .social-economist a { background: #0bbadf }
.social-profile-icons .social-forbes a { background: #ff4400 }


widget-social.php

Kod:
class Social_Profile_Icons_Widget extends WP_Widget {

    protected $defaults;
    protected $sizes;
    protected $profiles;

    function __construct() {

        $this->defaults = array(
            'title'            => '',
            'new_window'    => 0,
            'size'            => 32,
            'facebook'        => '',
            'twitter'        => '',
            'instagram'        => '',
            'youtube'        => '',
            'gplus'            => '',
            'fbgrubu'        => '',
            'bloomberg'        => '',
            'ntveko'        => '',
            'ekodialog'        => '',
            'sabaheko'        => '',
            'hteko'            => '',
            'aaekonomi'     => '',
            'onedio'        => '',
            'mynet'            => '',
            'pazarlamasyon'    => '',
            'bbceko'        => '',
            'bigpara'       => '',
            'ebakanlik'        => '',
            'capital'        => '',
            'economist'        => '',
            'forbes'        => '',
        );


        $this->sizes = array( '32' );

        $this->profiles = array(
            'facebook' => array(
                'label'      => __( 'Facebook URI', 'sensational' ),
                'pattern' => '<li class="social-facebook"><a title="Facebook" href="%s" %s><i class="fa fa-facebook"></i></a></li>',
            ),
            'twitter' => array(
                'label'      => __( 'Twitter URI', 'sensational' ),
                'pattern' => '<li class="social-twitter"><a title="Twitter" href="%s" %s><i class="fa fa-twitter"></i></a></li>',
            ),
            'instagram' => array(
                'label'      => __( 'Instagram URI', 'sensational' ),
                'pattern' => '<li class="social-instagram"><a title="Instagram" href="%s" %s><i class="fa fa-instagram"></i></a></li>',
            ),
            'youtube' => array(
                'label'      => __( 'YouTube URI', 'sensational' ),
                'pattern' => '<li class="social-youtube"><a title="YouTube" href="%s" %s><i class="fa fa-youtube"></i></a></li>',
            ),
            'gplus' => array(
                'label'      => __( 'Google+ URI', 'sensational' ),
                'pattern' => '<li class="social-gplus"><a title="Google+" href="%s" %s><i class="fa fa-google-plus"></i></a></li>',
            ),
            'reddit' => array(
                'label'      => __( 'Reddit URI', 'sensational' ),
                'pattern' => '<li class="social-fbgrubu"><a title="Facebook Grubu" href="%s" %s><i class="fovari-fbgrubu"></i></a></li>',
            ),
            'pinterest' => array(
                'label'      => __( 'Pinterest URI', 'sensational' ),
                'pattern' => '<li class="social-bloomberg"><a title="Bloomberg HT" href="%s" %s><i class="favori-bloomberg"></i></a></li>',
            ),
            'linkedin' => array(
                'label'      => __( 'Linkedin URI', 'sensational' ),
                'pattern' => '<li class="social-hteko"><a title="NTV Ekonomi" href="%s" %s><i class="favori-ntveko"></i></a></li>',
            ),
            'soundcloud' => array(
                'label'      => __( 'Soundcloud URI', 'sensational' ),
                'pattern' => '<li class="social-ekodialog"><a title="Ekodialog" href="%s" %s><i class="favori-ekodialog"></i></a></li>',
            ),
            'behance' => array(
                'label'      => __( 'Behance URI', 'sensational' ),
                'pattern' => '<li class="social-sabaheko"><a title="Sabah Ekonomi" href="%s" %s><i class="favori-sabaheko"></i></a></li>',
            ),
            'flickr' => array(
                'label'      => __( 'Flickr URI', 'sensational' ),
                'pattern' => '<li class="social-hteko"><a title="HT Ekonomi" href="%s" %s><i class="favori-hteko"></i></a></li>',
            ),
            'dribbble' => array(
                'label'      => __( 'Dribbble URI', 'sensational' ),
                'pattern' => '<li class="social-aaekonomi"><a title="AA Ekonomi" href="%s" %s><i class="favori-aaekonomi"></i></a></li>',
            ),
            'github' => array(
                'label'      => __( 'GitHub URI', 'sensational' ),
                'pattern' => '<li class="social-onedio"><a title="Onedio Ekonomi" href="%s" %s><i class="favori-onedio"></i></a></li>',
            ),
            'skype' => array(
                'label'      => __( 'Skype URI', 'sensational' ),
                'pattern' => '<li class="social-mynet"><a title="Mynet Finans" href="%s" %s><i class="favori-mynet"></i></a></li>',
            ),
            'stumbleupon' => array(
                'label'      => __( 'StumbleUpon URI', 'sensational' ),
                'pattern' => '<li class="social-pazarlamasyon"><a title="Pazarlamasyon" href="%s" %s><i class="favori-pazarlamasyon"></i></a></li>',
            ),
            'vimeo' => array(
                'label'      => __( 'Vimeo URI', 'sensational' ),
                'pattern' => '<li class="social-bbceko"><a title="BBC Ekonomi" href="%s" %s><i class="favori-bbceko"></i></a></li>',
            ),
            'dropbox' => array(
                'label'      => __( 'Dropbox URI', 'sensational' ),
                'pattern' => '<li class="social-bigpara"><a title="Bigpara" href="%s" %s><i class="favori-bigpara"></i></a></li>',
            ),
            'tumblr' => array(
                'label'      => __( 'Tumblr URI', 'sensational' ),
                'pattern' => '<li class="social-ebakanlik"><a title="Ekonomi Bakanlığı" href="%s" %s><i class="favori-ebakanlik"></i></a></li>',
            ),
            'email' => array(
                'label'      => __( 'Email URI', 'sensational' ),
                'pattern' => '<li class="social-capital"><a title="Capital" href="%s" %s><i class="favori-capital"></i></a></li>',
            ),
            'foursquare' => array(
                'label'      => __( 'FourSquare URI', 'sensational' ),
                'pattern' => '<li class="social-economist"><a title="The Economist" href="%s" %s><i class="favori-economist"></i></a></li>',
            ),
            'rss' => array(
                'label'      => __( 'RSS URI', 'sensational' ),
                'pattern' => '<li class="social-forbes"><a title="Forbes" href="%s" %s><i class="favori-forbes></i></a></li>',
            ),
        );

        $widget_ops = array(
            'classname'    => 'social-profile-icons',
            'description' => __( 'Show profile icons.', 'sensational' ),
        );

        $control_ops = array(
            'id_base' => 'social-profile-icons',
            #'width'   => 505,
            #'height'  => 350,
        );

        parent::__construct( 'social-profile-icons', sprintf( __( '%sSocial Profile Icons', 'sensational' ), MTS_THEME_WHITE_LABEL ? '' : 'MTS ' ), $widget_ops, $control_ops );

    }

Teşekkürler.


Konu ile Alakalı Benzer Konular
Konular / Yazar Yorumlar / Okunma Son Yorum
0 Cevaplar 17 Görüntüleme
Son Yorum wmcaner
11-12-2017, Saat: 18:55




Konuyu Okuyanlar: 1 Ziyaretçi

Şok Aktüel