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

Katılım
6 Eki 2017
Mesajlar
2
Beğeniler
0
#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


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.
 

Bu konuyu okuyanlar (Üyeler: 1, Misafirler: 0)

Üst