Здравствуйте мои дорогие друзья!
Сегодня я хочу поделиться с вами ещё одной довольно полезной информацией о том, где и как сделать кнопку для сайта.
Гуляя по просторам интернета я наткнулась на очень интересный онлайн сервис, где можно сделать за 5 мин вот такие, или такие как нужно вам, симпатичные кнопки для сайта. Вы можете вписать в эти кнопки любой нужный вам текст, любого цвета и с любым фоном. Эти кнопки маскируют ваши гиперссылки для перехода на другую, заданную в гиперссылке страницу.
Красивый дизайн сайта всегда привлекает к себе внимание ваших посетителей, и они приходят к вам чаще. Эти кнопочки создают более привлекательный вид нежели написанные слова «Скачайте по этой ссылке» , а то и вообще просто ссылка, и многое в этом духе.
Согласитесь, что красивая и эффектная кнопочка будет выглядеть всегда привлекательнее и будет вызывать куда большее желание чтобы нажать на неё. Сохранённые в png формате они весят очень мало, а сделать их можно даже менее чем за 5 мин. Пять минут мне понадобилось на первую кнопочку пока всё попробовала и рассмотрела, а за следующие 10 минут я поменяла все кнопки на своём блоге на новые.
Конечно, сделать кнопку для сайта можно разными способами, к примеру, в фотошопе. Но это сделать может только тот человек кто очень хорошо «дружит» с этой программой, а для новичка это будет сделать довольно проблематично, во всяком случае, пока он не освоит хотя бы азы фотошопа, и займёт это кучу времени.
Можно скачать у кого то готовую, но не факт что она будет подходить по цветовой гамме вашего сайта. Лично для меня из всех зол, этот самый лёгкий.
Рассмотрим как сделать кнопку для сайта.
Итак, приступим к знакомству с сервисом Da Button Factory и познакомимся с тем, как же он работает.
Переходим на сайт dabuttonfactory.com
Чтобы вам легче было понять, особенно тем у кого нет перевода страницы я сделаю на скриншоте русский перевод.
Рассмортим первый блок:
Как видно на скриншоте, вам нужно только ввести "текст" вашей кнопки, задать ей "шрифт" простой, либо "жирный" или "наклонный" (поставив там галочку), нужна "тень текста" или нет(указав галочкой). Если тень нужна то задать её "размер и цвет".
В нижнем маленьком блоке нужно выбрать "тип выхода" кнопки. Для установки на странице вашего блога выбираете "изображение", которое потом скопируете на компьютер, а если вам нужно вставить кнопку в виджет сайдбара, то тогда, выбираете "CSS фон", потом скопируете код для вставки в виджет.
Переходим ко второму блоку:
Здесь выбираем "стиль" нашей кнопки - "прямоугольный", "округлый" или "круглый".
Подбираем "фон" - "два цвета","градиент" или "пирамида" (экспериментируйте сами) и подбираем цвет фона.
Выбирая "пограничная" вы делаете обводку вашей кнопки нужного вам цвета (откроется дополнительное окно).
Поставив галочку " тени?" вы можете сделать в дополнительной области глубину тени и её цвет.
Больше я ничего не ставила, а вы можете по экспериментировать, если у вас будет желание. В нижнем блоке оставляйте "размер" - "переменная", тогда размер вашей кнопки будет увеличиваться в длину, при написании текста, автоматически.
Можете поменять отступы по вертикали и горизонтали, лично я всё оставляла по умолчанию и ничего не меняла (меня всё пока устраивало).
Между блоками будет находиться сама кнопка, которая будет меняться сразу по мере изменения вносимых данных. Поэтому вы будете сразу видеть свою кнопку в реальном изображении, что даёт возможность очень быстро менять её внешний вид на тот который нужен вам. Этот скриншот я сделала сразу с переводом на русский язык, чтобы вам было понятно.
Когда кнопка готова, вы можете нажать на "загрузки" и она скачается на компьютер. Но я скачиваю их по другому, чтобы не тянуть вместе с изображением ссылку на этот сайт. Я кликаю правой кнопкой мыши по изображению и нажимаю "сохранить как..." и сразу сохраняю эту картинку уже под тем названием каким я пропишу сама.
Если вы на первом скриншоте в "типе выхода" указали "изображение", то у вас под кнопкой будут только две строчки со ссылками,а если указали "CSS фон", то у вас ниже сразу откроется и код вашей кнопки, который вам нужно будет скопировать и вставить в виджет вашего сайдбара или туда куда вам ещё нужно. Но имейте ввиду что вместе с кодом вы переносите на свой блог и ссылку этого сайта.
Лично у меня стоит плагин, который закрывает все внешние ссылки от индексации, а если у вас такого нет то можете посмотреть Плагин для защиты от внешних ссылок. либо закрыть эту ссылку вручную.
Ну вот вроде бы и всё. Красивых Вам кнопок!
Если вам понравилась статья, как сделать кнопку для сайта, то делимся ею со своими друзьями в соц.сетях либо обмениваемся мнениями в комментариях.
Интересный сервис, нужно будет попробовать, потренироваться… Где нибудь да пригодится кнопочка… Хорошо, что можно сделать ее по своему желанию разной.
А главное Лидия очень быстро! На первую пока всё попробуете может и уйдёт 5 мин , на последующие можно сделать и за 1 минуту.
Ольга, спасибо большое за полезную информацию. Обязательно установлю такие кнопочки и на свой сайт. Весь процесс установки очень доходчиво изложен, и я думаю ни для кого не составит труда сделать всё самостоятельно. Еще раз спасибо.
Это действительно очень понятно, а главное быстро и красиво.
Спасибо, Ольга! Очень интересный и полезный сервис! Обязательно воспользуюсь им и создам эти кнопочки!
Главное, что он понятный и всё делать очень быстро.
Ольга, спасибо за хорошую подсказку. Надо посмотреть. Обязательно пригодится на наших сайтах!
Сделать её всегда быстрее чем потом где то искать картинку на это похожее. А применить их можно как угодно, здесь дело вкуса и фантазии.
Понравилась кнопочка. Я всякие прибамбасы люблю, но мне трудно все дается. Привлекает, что просто и быстро. Надо попробовать.
Попробуйте Тамара, там действительно всё очень легко.
А как под нее ссылку подставить? Ведь кнопка должна куда-то вести?
Очень просто Ирина! В редакторе когда установите эту кнопку в вашу запись, нужно нажать на неё (так же как вы и увеличиваете или уменьшаете картинку) и нажать на значёк в редакторе гиперссылка.У вас откроется дополнительное окошко куда вам нужно ввести нужный URL адрес.Всё тоже самое как вы делаете и перелинковку, только там вы выделяете сам текст а здесь саму картинку. А если вам нужно вставить в сайдбар кодом, то сначала поставьте эту картинку в поле записи, сделайте из неё гиперссылку как я уже описала, а потом переведите вашу картинку в редакторе на HTML просмотр.Вам откроется код этой картинки с уже вставленной гиперссылкой.Скопируйте этот код и вставьте его в виджет сайдбара или туда куда вам ещё нужно. Всё. При нажатии на кнопку она сработает как гиперссылка и перенаправит вас на другую страницу.
От спасибо! Не догадалась! А кнопочка отличная! Пробовала. Все просто!
Мне этот сервис тоже понравился своей простотой.
Спасибо за нужную информацию как раз то что нужно мне было С меня твит
За твит отдельное спасибо.
Здорово. Беру на заметку. И себе, и поделюсь с теми, кто не очень дружит с фотошопом и HTML-ом. Спасибо.
Возьмите, всегда пригодится.
Ольга. У Вас очень неплохие скриншоты получаются, спасибо.
Спасибо! Мне приятно что вам понравилось.
Спасибо Вам Ольга за подробное разъяснение про эти красивые кнопочки. Скриншоты мне тоже очень понравились.
Спасибо за ваши хорошие слова.
Полезно, особенно для одностраничников. Там даже не страшно, что лишняя ссылка.
Им можно везде найти применение.
Спасибо, обязательно возьму на заметку! Вдруг когда пригодится!
Пригодятся! Главное что делать их быстро.
А почему шаблон не меняете? Полезная информация теряется…. Хотите побольше статей написать, а потом переехать?
Да вот как раз этим вопросом и занимаюсь.
Отлично) А то очень ценная, хорошая информация на его фоне теряется.
Успехов в выборе нового шаблона! Сама знаю, что это не сильно легко. Кажется, что их очень много, а на сама деле, как начнешь искать, так ничего приличного и нет)))). И вечно что-то доделывать/изменять приходится….
В общем, терпения вам и удачи)
Да я вот в принципе и хочу сделать свой собственный шаблон. Вот и сижу вечерами.Изучаю эту науку. В инете мне что то особо ничего не приглянулось.Как вы говорите всё что то да всё не то.Один сделала но хочу сделать парочку и потом что больше приглянется тот и оставлю.
Оля, у меня получилось установить эту кнопку, большое спасибо. На сколько привлекательней смотрится страничка, просто класс!
Мне тоже с ними нравится больше.
Сервис, действительно, очень хорош. И в работе просто незаменим. Пользуюсь им.
Для меня эта статья очень актуальна, большое спасибо. Занесу в закладки.
Они всегда могут пригодиться.
Ольга, спасибо. Мне очень пригодится.
Да я и сама к ним теперь обращаюсь почти в каждой статье.
Очень интересно и информативно,хорошо разъясненная тема должна привлечь внимание и вернуть посетителя на сайт.Александр(monymaker.ru)
Мне тоже нравится быть так где написано доступным языком. Вот и стараюсь.
Использовал в своей новой статье, спасибо за находку.+
Теперь вы будете его использовать часто. Знаю по себе.
У Вас всегда можно почерпнуть интересную информацию для сайта. Я, как белочка в дупло, складываю всё в закладки, но не нахожу времени, чтобы применить на практике. Надо будет как-то забросить все дела и пересмотреть всё, что насобирала. Спасибо.
К сожалению не одни вы. У меня уже столько накопилось о чём и написать и самой сделать нужно, а времени так на всё не хватает.
Отличный сервис по созданию кнопки, спасибо Ольга, за столь подробный и понятный рассказ о создании кнопки для сайта.