Пульс блогосферы

Вся информация, содержащаяся в этой рубрике посвящена тем, кто ведет в сети свои блоги и чувствует себя своим в мире блогосферы. Всем активным и начинающим блоггерам посвящаются уникальные материалы, многие из которых долгое время удерживают свои позиции в топе выдачи поисковых систем.

Кастомные чекбоксы. Стилизация через CSS (Custom checkboxes)

custom-checkbox

Привет, ребята. В этой небольшой статье я покажу вам симпатичные кастомные чекбоксы на CSS, которые активно использую в различных проектах. Сразу скажу, что это лишь один из множества вариантов стилизации чекбоксов. Придумать их вид можно абсолютно любой, если хорошо работает фантазия. Но я делаю чекбоксы в виде неких переключателей, которые очень прикольно выглядят и что самое немаловажное — подходят практически под любой дизайн, тем более, что цвета можно подобрать как раз под общую гаму сайта.

Демо

Обычно стилизация чекбоксов на CSS происходит с использованием псевдоклассов. Я привязываюсь к тегу label, которого может и не быть рядом с чекбоксом, но я его оставлю. Вот так:

1
2
<input type="checkbox" class="checkbox" id="box"/>
<label for="box"></label>

Класс checkbox был написан для удобства напиcания CSS, а ID для привязки лейбла и изменения цвета в последующем. Теперь напишем сам CSS код и стилизуем чекбокс.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
.checkbox {
  position: relative;
  z-index: -1;
  opacity: 0;
 
}
.checkbox + label {
  position: relative;
  cursor: pointer;
}
.checkbox + label:before {
  content: '';
  position: absolute;
  top: -4px;
  left: 0;
  width: 50px;
  height: 26px;
  border-radius: 13px;
  background: #CDD1DA;
  box-shadow: inset 0 2px 3px rgba(0,0,0,.4);
  transition: .2s;
}
.checkbox + label:after {
  content: '';
  position: absolute;
  top: -2px;
  left: 2px;
  width: 22px;
  height: 22px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 2px 5px rgba(0,0,0,.4);
  transition: .2s;
}
.checkbox:checked + label:before {
  background: #006cfa;
}
.checkbox:checked + label:after {
  left: 26px;
}

У нас практически все готово. Теперь для того, чтобы изменить фоновый цвет конкретного чекбокса, вы можете дописать такой код:

1
2
3
#box:checked + label:before{
  background: #8BC34A;
}

А если в сам label необходимо поместить какой-то текст, то начиная с 7 строки, где .checkbox + label нужно дописать padding, чтобы в итоге получилось вот так:

1
2
3
4
5
.checkbox + label {
  position: relative;
  padding: 0 0 0 60px;
  cursor: pointer;
}

На этом стилизация кастомных чекбоксов окончена. Кода получилось совсем не много. Спасибо за внимание.

Где взять уникальный контент для сайта или группы

Уникальный контент

Привет. Если вы зашли на эту страницу с целью узнать где брать контент для сайта, группы вконтакте, фейсбук или одноклассники и желательно получать его в больших количествах и к тому же бесплатно, то сейчас постараюсь рассказать подробно о том, как добываю его я. На страницах моего блога уже имеется статья на эту тему, но она не отражает всей сути происходящего, поэтому здесь будет ее дополнение.

Если вы не знаете, то контент для своих постов я пишу самостоятельно и это самый лучший вариант в принципе, который можно придумать. Создавая статью, я делаю акцент на ее практическую пользу посетителям сайта, а так же оптимизируя под определенные поисковые запросы, по которым ее будут находить. То, что вы сейчас читаете, писалось точно так же. Благодаря такому подходу мой блог имеет конкурентное преимущество в поиске среди остального, менее качественного материала. На выходе мы получаем полезный, уникальный, бесплатный контент, который в последствии будет приносить трафик. Но если вы не разбираетесь в SEO и не можете грамотно излагать свои мысли, то есть такое направление, как рерайтинг (rewriting), то есть переписывание текста своими словами.

Где взять контент для пабликов, инстаграма

Здесь все гораздо проще. Большинство администраторов групп ВК копируют друг у друга контент для мотивации пользователей и чувствуют себя при этом прекрасно. В социальных сетях все же превалируют графические элементы над текстом и индивидуальность изображений здесь не особо важна. Другое дело инстаграм. Авторские права в нем очень хорошо защищают и постить что попало вам просто не позволят. Поэтому прежде, чем что-то размещать, нужно проверить картинки на уникальность.

Если у вас есть затруднение в написании статей, то можно обратиться за помощью к друзьям, подруге, жене, мужу принять участие в интересном проекте, в котором он будет выступать, как ведущий копирайтер. В случае успешного развития, делиться с ним прибылью.

Где брать контент для ютуба

На Youtube очень жесткие правила по отношению к видеоконтенту и просто так взять и перезалить чужой ролик не получится. Можно получить за это страйк. Ввиду этих обстоятельств могу посоветовать снимать свои видео самим и выкладывать на видеохостинг. Только в этом случае можно успешно развивать свой канал. О других способах я не знаю, если располагаете информацией о том где еще можно брать контент. то напишите об этом в комментариях.

Оформление облака тегов на сайте в виде ярлыков с помощью CSS3

Ярлыки CSSЗдравствуйте, друзья. На одном из забугорных сайтов обнаружил красивое оформление облака тегов в виде ярлыков. И сразу же задумался о том, как сделать такое на своем блоге. Сначала показалось, что реализовано все на jQuery, потому что теги очень плавно реагировали на наведение, но потом оказалось, что на чистом CSS3 и HTML. Смотрите пример.

Демо

Помнится когда-то давно в WordPress был плагин облака тегов, в виде карусели, но он работал на флеш и сейчас я его уже нигде не вижу, видимо уже неактуален. Теперь можно создать не менее красивые теги, оформленные на HTML. И для этого не нужны никакие модули. Нужно всего лишь задать определенные CSS стили и ваш ресурс преобразится и заиграет новыми красками. Не важно на чем он функционирует, на Joomla, uCoz или Modx. Трудиться будем непосредственно с кодом.

Готовые CSS стили для облака тегов

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
.post-tag{
  margin:-30px 0 35px
}
.post-tag a{
  background-color:#aaa;
  border-radius:0 2px 2px 0;
  color:#fff;
  display:inline-block;
  font-size:11px;
  line-height:13px;
  margin:0 0 2px 10px;
  padding:4px 7px 3px;
  position:relative;
  text-transform:uppercase; 
  transition: 0.2s linear
  -webkit-transition: 0.2s linear; 
  -moz-transition: 0.2s linear; 
  -o-transition: 0.2s linear; 
}
.post-tag a:before{
  border-top:10px solid transparent;
  border-right:8px solid #aaa;
  border-bottom:10px solid transparent;
  content:"";
  height:0;
  position:absolute;
  top:0;left:-8px;
  width:0;
  transition: 0.2s linear; 
  -webkit-transition: 0.2s linear; 
  -moz-transition: 0.2s linear; 
  -o-transition: 0.2s linear; 
}
.post-tag a:after{
  background-color:#fff;
  border-radius:50%;
  content:"";
  height:4px;
  position:absolute;
  top:8px;
  left:-2px;
  width:4px
}
.post-tag a:hover{
  background:#444;
  color:#FFF
}
.post-tag a:hover:before{
  border-right-color:#444
}

Это уже готовые CSS стили для облака тегов, которые будут дополнительными. Их можно вставить в ваш файл таблицы. А Выводить на странице их нужно таким образом:

<p class="post-tag"><a href="#">Надпись на ярлыке</a></p>

Чтобы сделать красивое облако тегов для сайта и, главное, чтобы они гармонично вписались в ваш дизайн, стили оформления, можно изменять, а именно цветовую схему по вашему усмотрению. Для этого используйте таблицу безопасных цветов. Если вы так же, как и я ведете дневник на WordPress и хотите все это хозяйство внедрить туда, то нужно заглянуть в код и посмотреть какие классы прописаны к текущим тегам и заменить все параметры CSS стилей на новые. Если плохо в этом разбираетесь, можете написать мне и, возможно я вам помогу. ) А пока скачайте архив с готовыми стилями.

СКАЧАТЬ

Где брать картинки для блога

каталог организаций Здравствуйте, друзья. Если вы тоже ведете свой дневник, то рано или поздно встает вопрос: где брать картинки для блога. Когда я начинал вести, то не задумывался об этом и брал их с других сайтов, но как потом оказалось, это не очень хороший выход из положения. Ведь изображения должны быть уникальными, так же, как и другой контент. Поэтому идеальным вариантом будет изготовление их самостоятельно в каком-нибудь графическом редакторе, например фотошопе.

Красивые картинки для блога бесплатно

Картинки нужны для оформления блога, они разбавляют текст и читать его становится гораздо легче. Со временем можно выработать свой собственный стиль и делать картинки с надписями, примерно так, как вы можете наблюдать у меня. Итак, где же их брать.. В этой статье вы узнаете, как я рисую image, чтобы они были уникальными и там же найдете 10 потрясающих сайтов, на которых найдется графика практически под любую тематику.

В принципе, картинки для блога можно брать с других ресурсов, но только изменять их до неузнаваемости, чтобы к вам потом не было претензий, что вы их украли. Но лучше конечно брать стоковые bpj,hf;tybz, то есть те, которые находятся в свободном доступе и уже с ними работать.

Заработок на CPA партнерках

Браузер Opera 2014

Когда я впервые услышал про заработок на CPA партнерках и зашел в партнерскую сеть Admitad и посмотрел на цифру заработка за предыдущие сутки, то подумал, что за бред!!! Кстати, цифра была в три раза больше, чем сейчас и составляла полтора миллиона. И как тут написано, это заработок за последние сутки. И, естественно, я, как и многие, не поверил этому. Ведь если вдуматься, то как можно зарабатывать полтора миллиона рублей за одни сутки. Это в месяц получается миллион долларов. Интересно, кто этот человек, я хотел бы у него поучиться.Того самого человека я конечно не нашел, но зато нашел другого, который предоставил мне информацию по работе с CPA партнерками. Поработав совсем немного, я понял, что эта цифра вполне реальная и что действительно есть такие люди, которые столько зарабатывают.

Заработок на CPA

Дело в том, что мы с вами видим только голую цифру дохода, но не можем знать, сколько было порачено, чтобы ее получить. При таких цифрах заработка объемы вложений весьма внушительны и далеко не каждый может себе позволить тратить на продвижение партнерских продуктов 100 или 200 тысяч рублей и это скорее всего в день. Но к таким объемам можно прийти. Я работаю совсем недавно, вложения минимальные, но заработок на CPA составляет около 2-х — 3-х тысяч рублей в сутки. Я пока еще прощупываю партнерку на предмет надежности, хотя она и так уже зарекомендовала себя с хорошей стороны. Со временем планирую наращивать объемы, покупать больше трафика и направлять его на партнерки. если вам тоже интересен этот вид заработка, то информацию по заработку на CPA партнерках можно посмотреть под этим видео.

Заработок на CPA