{
    "version": "https:\/\/jsonfeed.org\/version\/1",
    "title": "Техноблог, заметки с тегом: фишки",
    "home_page_url": "https:\/\/blog.toliklunev.ru\/tags\/fishki\/",
    "feed_url": "https:\/\/blog.toliklunev.ru\/tags\/fishki\/json\/",
    "icon": "https:\/\/blog.toliklunev.ru\/user\/userpic@2x.jpg",
    "author": {
        "name": "Анатолий Лунёв",
        "url": "https:\/\/blog.toliklunev.ru\/",
        "avatar": "https:\/\/blog.toliklunev.ru\/user\/userpic@2x.jpg"
    },
    "items": [
        {
            "id": "42",
            "url": "https:\/\/blog.toliklunev.ru\/all\/psevdoprotokol-tel\/",
            "title": "Псевдопротокол tel:",
            "content_html": "<p>Мобильные браузеры определяют телефон по тапу на нём и предлагают совершить звонок — это удобно. Но это работает, только если  в вёрстке телефон сделан единым текстом. Однако часто дизайнеры оформляют телефон так:<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/tel1.png\" width=\"215\" height=\"42\" alt=\"\" \/>\n<\/div>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/tel2.png\" width=\"204\" height=\"42\" alt=\"\" \/>\n<\/div>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/tel3.png\" width=\"203\" height=\"36\" alt=\"\" \/>\n<\/div>\n<p>В данном случае случае телефон придётся разбить на два блока, и единого текста, как не пытайся, не выйдет. Мобильный браузер, скорее всего, не определит телефон.<\/p>\n<p>На помощь приходит псевдопротокол tel. Оборачиваем телефон в ссылку с этим протоколом:<\/p>\n<pre class=\"e2-text-code\"><code>&lt;a href=&quot;tel:+7 (123) 456-78-90&quot;&gt;\r\n\t&lt;span class=&quot;code&quot;&gt;+7 123&lt;\/span&gt;\r\n\t&lt;span class=&quot;number&quot;&gt;456-78-90&lt;\/span&gt;\r\n&lt;\/a&gt;<\/code><\/pre><p>Теперь по тапу на ссылку браузер определит телефон.<\/p>\n",
            "date_published": "2014-12-29T21:14:02+04:00",
            "date_modified": "2017-01-17T23:24:10+04:00",
            "image": "https:\/\/blog.toliklunev.ru\/pictures\/tel1.png",
            "_date_published_rfc2822": "Mon, 29 Dec 2014 21:14:02 +0400",
            "_rss_guid_is_permalink": "true",
            "_rss_guid": "https:\/\/blog.toliklunev.ru\/all\/psevdoprotokol-tel\/",
            "_e2_data": {
                "is_favourite": false,
                "links_required": [
                    "system\/library\/highlight\/highlight.js",
                    "system\/library\/highlight\/highlight.css"
                ],
                "og_images": [
                    "https:\/\/blog.toliklunev.ru\/pictures\/tel1.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/tel2.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/tel3.png"
                ]
            }
        },
        {
            "id": "39",
            "url": "https:\/\/blog.toliklunev.ru\/all\/bystry-sposob-poluchit-svg-iz-vektornogo-sloya-v-fotoshope\/",
            "title": "Быстрый способ получить svg из векторного слоя в фотошопе",
            "content_html": "<p><strong>Данный способ работает только в Photoshop CC.<\/strong><\/p>\n<p>Первым делом создаём в домашней папке пользователя файл generator.json, со следующим содержимым:<\/p>\n<pre class=\"e2-text-code\"><code>{\r\n  &quot;generator-assets&quot;:  { \r\n    &quot;svg-enabled&quot;: true\r\n  }\r\n}<\/code><\/pre><p>Файл можно скачать (<a href=\"http:\/\/blog.toliklunev.ru\/download\/generator.json\" download=\"generator.json\">generator.json<\/a>), для ускорения процесса.<\/p>\n<p>Ставим галку в меню File → Generate → Image Assets.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/image-assets.png\" width=\"451\" height=\"657\" alt=\"\" \/>\n<\/div>\n<p>Затем переименовываем нужный слой, даём ему любое имя, заканчивающиеся на .svg (например pic.svg).<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/pic.svg.png\" width=\"280\" height=\"225\" alt=\"\" \/>\n<\/div>\n<p>И вуаля. Рядом с psd файлом получаем папку, в которой будет лежать готовый svg.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/svg-in-folder.png\" width=\"677\" height=\"108\" alt=\"\" \/>\n<\/div>\n<p>Можно переименовывать даже группу слоёв.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/group.svg.png\" width=\"387\" height=\"355\" alt=\"\" \/>\n<\/div>\n<p>Фотошоп довольно умно сгенерирует единый svg файл, учитывая все эффекты слоёв.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/svg-code.png\" width=\"745\" height=\"875\" alt=\"\" \/>\n<\/div>\n",
            "date_published": "2014-11-04T02:23:17+04:00",
            "date_modified": "2017-01-18T23:41:29+04:00",
            "image": "https:\/\/blog.toliklunev.ru\/pictures\/image-assets.png",
            "_date_published_rfc2822": "Tue, 04 Nov 2014 02:23:17 +0400",
            "_rss_guid_is_permalink": "true",
            "_rss_guid": "https:\/\/blog.toliklunev.ru\/all\/bystry-sposob-poluchit-svg-iz-vektornogo-sloya-v-fotoshope\/",
            "_e2_data": {
                "is_favourite": false,
                "links_required": [
                    "system\/library\/highlight\/highlight.js",
                    "system\/library\/highlight\/highlight.css"
                ],
                "og_images": [
                    "https:\/\/blog.toliklunev.ru\/pictures\/image-assets.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/pic.svg.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/svg-in-folder.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/group.svg.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/svg-code.png"
                ]
            }
        },
        {
            "id": "37",
            "url": "https:\/\/blog.toliklunev.ru\/all\/fishka-inputa-dlya-faylov-o-kotoroy-ne-vse-znayut\/",
            "title": "Фишка инпута для файлов, о которой не все знают",
            "content_html": "<p>Оказывается, при указании файла в браузере совсем необязательно мучится со стандартным диалоговым окном выбора файлов.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/filedialog.png\" width=\"768\" height=\"434\" alt=\"\" \/>\n<\/div>\n<p>Достаточно всего лишь перетащить нужный файл прямо на инпут.<\/p>\n<div class=\"e2-text-picture\">\n<img src=\"https:\/\/blog.toliklunev.ru\/pictures\/dropfile.png\" width=\"436\" height=\"424\" alt=\"\" \/>\n<\/div>\n<p>К сожалению, это волшебство никак не распространяется на лейб для инпута. Поэтому, если вы каким-либо образом пытаетесь оформить стандартный инпут, растяните его по размерам блока и скройте с помощью прозрачности.<\/p>\n",
            "date_published": "2014-10-12T06:11:55+04:00",
            "date_modified": "2014-10-12T06:41:03+04:00",
            "image": "https:\/\/blog.toliklunev.ru\/pictures\/filedialog.png",
            "_date_published_rfc2822": "Sun, 12 Oct 2014 06:11:55 +0400",
            "_rss_guid_is_permalink": "true",
            "_rss_guid": "https:\/\/blog.toliklunev.ru\/all\/fishka-inputa-dlya-faylov-o-kotoroy-ne-vse-znayut\/",
            "_e2_data": {
                "is_favourite": false,
                "links_required": [],
                "og_images": [
                    "https:\/\/blog.toliklunev.ru\/pictures\/filedialog.png",
                    "https:\/\/blog.toliklunev.ru\/pictures\/dropfile.png"
                ]
            }
        }
    ],
    "_e2_version": 3254,
    "_e2_ua_string": "E2 (v3254; Aegea)"
}