Ответы пользователя по тегу Вёрстка
  • Как немного доработать кастомные социальные share-кнопки?

    Про этот способ я не совсем понял. Но когда мне нужно сделать свой дизайн для социальных кнопок поделиться то я делаю так. С начало я подключаю к сайту блок Поделиться от Яндекса https://tech.yandex.ru/share/ с теми кнопками которые мне нужны. Дизайн на данный момент можно выбрать любой.
    Затем в подключенном скрипте можно настроить этот блок таким способом.

    new Ya.share({
    	element: 'yaShare',
    	elementStyle: {
    		'type': 'button',
    		'quickServices': ['vkontakte', 'facebook', 'gplus']
    	},
    	onready: function(instance) {
    		$(instance._block).find('a.b-share__handle').each(function() {
    			var el = $(this);
    			el.removeClass();
    			
    			if (el.find('span').hasClass('b-share-icon_vkontakte')) {
    				el.find('span').remove();
    				el.append('<b class="icons-vk"></b>');
    			}
    
    			if (el.find('span').hasClass('b-share-icon_facebook')) {
    				el.find('span').remove();
    				el.append('<b class="icons-facebook"></b>');
    			}
    
    			if (el.find('span').hasClass('b-share-icon_gplus')) {
    				el.find('span').remove();
    				el.append('<b class="icons-google"></b>');
    			}
    
    			if (el.find('span').hasClass('b-share-form-button')) {
    				el.find('span').remove();
    			}
    		});
    	}
    });

    Из кода видно что после того как блок от Яндекса загружен в нем ищется и удаляются span'ы c дизайном от яндекса и вместо них добавляются блоки с теми классами с которыми вам необходимы.
    Ответ написан
    Комментировать