Перейти к содержимому

Реферальная программа Мегаплана

Партнерская программа Kredov

Как сделать уникальный сайт на WordPress

#1 varebux

varebux
  • Пользователь
  • 35 сообщений
  • Репутация: 3
10

Отправлено 01 Апрель 2012 - 02:49

http://youtu.be/LsKNHFbV-dU

Пролог

Всем привет. Хочу рассказать мою историю по созданию сайтов и освоению просторов интернета по сайтостроению. Начну с того, что я не имею образования в данной области, а так же не являюсь профессиональным программистом. По профессии я юрист и от самого начала до конца все полученные мною знания основывались только на собственном изучении материала. Вся информация, которая мною была впитана в процессе просвещения в настоящее время вырывается наружу и мне хочется донести ее до остальных, до тех, кто в настоящее время задает себе вопрос: «а с могу ли я?»
Это первая моя статья на данную тематику, до этого времени мной не было написано ни одной статьи о создании сайтов. Сейчас в сеть мною запущено около 10 сайтов, по разным направлениям и тематикам. Все сайты являются уникальными и делались с нуля. Первый достойный проект был сделан летом 2011 года для организации в которой я работаю. Мое руководство по достоинству оценило мои умения, которых на самом деле у меня и не было, а все получилось только благодаря усердной самоподготовке и рвению в изучении нужной информации, по реализации которой в конце года я получил премию в размере 1 000 $. Для меня это была значимая сумма, мой заработок в то время составлял около 800 $, то есть месяц я мог не работать только благодаря одному сайту!
Дальше, больше. Мои знакомые по работе и просто люди с которыми я общался узнали про мои способности. После чего несколько человек попросили меня сделать для их организаций такие же сайты. Я не просил от них взамен вознаграждение и какую-либо выгоду для себя. Я только хотел сделать что-то красивое и современное, это позже мной и было реализовано в виде красиво собранных таблиц, кодов и картинок. И тут не имея цели на обогащение, по выполнении всех работ я был материально поощрен в виде наличности в 200 долларов.
Но вернемся к началу моей истории, когда я еще и не мог себе представить, что смогу это сделать, а мои труды будут востребованы.



Глава 1

Как это устроено и на чем остановиться?



Первый мой шаг заключался в изучении и анализе всех бесплатных движков на которых работают сайты в интернете. Перечитав кучу информации, и просмотрев статистику с многих ресурсов (в закладках я нашел ссылку на этот источник http://ktonanovenkog...ntom-sajta.html) я узнал, что большая часть сайтов работает на двух движках:

Joomla
WordPress.

Дальше, анализируя информацию, от пользователей на сайтах, форумах и блогах я остановился на движке WordPress. Возможности данногодвижка не имеют границ и не измеряются ни в каких единицах. С помощью WordPress можно сделать практически любой сайт, и при его использовании все «слепить» как надо. Примеры сайтов на WordPress Вы можете посмотреть в google или yandex.

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






Глава 2

Дизайн.



Самой главной моей задачей, после выбора движка было сделать уникальный дизайн, тот который действительно нравился бы мне. Платить не хотелось. На многих сайтах, которые были мною прочитаны, имелась только инструкция, как сделать сайт, а про уникальный дизайн не слова.
Какой будет дизайн сайта, я видел с самого начала создания, но не знал, как это можно реализовать, так как не имел навыков работы с графическими программами, такими как Adobe Photoshop. Я не знал как можно соединить нужные мне картинки с текстом. Начались поиски бесплатных готовых шаблонов в сети. Но все скачанные шаблоны мне не нравились, нужна была уникальность, своя шапка сайта, свой вид, свои шрифты и т.д.
Где-то неделю я просидел в интернете в поисках «своего» шаблона! Каждый день качал десятки шаблонов, примерял их на сайте и удалял. После начал искать в сети онлайн конструкторы, и все возможные программы для того, чтобы сделать свой дизайн, на это ушла еще одна неделя моего времени. В конечном итоге у меня было желание сдаться и оставить какой-нибудь готовый, скачанный, бесплатный шаблон. Но, в последний момент я наткнулся на программу Artisteer. Скачал и установил себе на компьютер. И начал творить. Это был клад, который я искал две недели! В функциях данной программы я разобрался за несколько часов, после чего начал делать пробные версии шаблонов. Все, что у меня получалось мне нравилось, и устраивало, так как я делал то, что хотели видеть мои глаза. Чуть позже я купил лицензию на данную программу за 50 $, так как с крякнутой версией Artisteer возникли проблемы: не сохранялись проекты, и функционал программы был не полный. За лицензию я отдал 50 $ - эти деньги давно мной уже отбиты. Все слухи о том, что шаблоны Artisteer кривые, не воспринимаются поисковыми системами полная ерунда. Поверьте, на моих примерах, все работает нормально.
Если Вы хотите сделать собственный уникальный дизайн, Вам так же необходимо будет освоить не много Adobe Photoshop. Я вам расскажу, как это можно сделать. Adobe мной использовался при создании шапки сайта. Больше никаких знаний в создании уникального дизайна Вам знать на первых шагах не надо, Вы получите то, что хотите видеть!







Глава 3

Хостинг.


При выборе хостинга, мною так же была проанализирована информация на различных сайтах, всевозможные рейтинги и комментарии. Мне была нужна простота, понятность и доступность, а так же предоставление хостером бесплатных дней для того чтобы протестировать будущий сайт.
Я остановил свой выбор на beget.ru и по сей день рад данному выбору. Практически вся информация о данном хостере подтвердила мои ожидания (в закладках нашел обзор http://beget.hosting-obzor.ru/). Хостинг на 100 % держит нагрузку, и русское простое функциональное меню заслуживает только восхищения!


Глава 4

Отступление.


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






Глава 5

Установка.



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





Раздел № 1 регистрация хостинга.

Шаг № 1
Переходим на хостинг beget.ru. И выбираем самый первый тариф Blog. В будущем, если Вам понадобиться увеличить пространство или добавить какие-нибудь функции через форму обратной связи поддержка Бегета Вам все сделает, без каких-либо проблем.
Изображение
Шаг № 2
Жмем на кнопку далее.
Изображение
Шаг № 3
Надо ввести свои личный данные. Ввод своих данных на Ваше усмотрение, но если в будущем Ваш проект станет популярным могут возникнуть проблемы при доказывании, что он действительно Ваш. Вводим...
Изображение
Шаг № 4
Вводим свой номер, нам должно прийти смс сообщение.
Изображение
Шаг № 5
Вводим код из смс сообщения.
Изображение
Шаг № 6
Видим такое окно. Поздравляю регистрация окончена! Записываем или запоминаем наш логин с паролем.
Изображение
Шаг № 7
Переходим на главную страницу и вводим пароль с логином.
Изображение
Шаг № 8
И вот перед нами меню хостинга, в котором сможет разобраться подросток. Все написано русским буквами, лежит по полочкам и у меня не возникало ни разу никаких проблем, при его использовании. Вот и все теперь у нас есть хостинг с 30 дневным бесплатным доступом.
Изображение







Раздел № 2 пополнение счета для покупки домена.

Конечно, без домена, а если сказать по-русски имени, наш сайт не будет работать. С доменом нужно так же определиться в начале нашего пути. Имя сайта должно быть простым и легких в запоминании, а еще лучше каким-нибудь уникальным, но это все зависит от Вашего вкуса, как хотите так и называйте. После этого нам нужно зарегистрировать домен на себя.
Для начала проверям свободно ли наше доменное имя.
http://beget.ru/regdom, если все в порядке идем дальше. Для того чтобы наше доменное имя начало работать на хостинге beget.ru нам нужно определиться с доступной зоной( ru, com, org, cc и т.д.) и закинуть в наш аккаунт beget.ru деньги в зависимости от зоны от 120 до 1 500 рублей. Цены тут http://beget.ru/regdom.
Шаг № 1
Переходим по вкладке ОПЛАТА.
Изображение
Шаг № 2
Выбираем произвольную сумму, на сколько мы хотим пополнить аккаунт.
Изображение
Шаг № 3
Выбираем удобный для нас способ, и пишем свою почту. Лично я плачу банковской картой, переводы всегда проходят, проблем не возникало.
Изображение
Шаг № 4
На примере карты вводим свои данные, и жмем оплатить. После чего деньги должны зачислиться в аккаунт.
Изображение
Шаг № 5
И мы увидим, эту сумму соответственно у Вас будет своя цифра.

Изображение
Переходим к следующему разделу.







Раздел № 3 регистрация домена.

Шаг № 1
Переходим на вкладку домены.
Изображение
Шаг № 2
Пишем свое доменное имя которое мы хотим видеть.
Изображение

Шаг № 3
Вводим свои данные. Ввод своих данных на Ваше усмотрение, но в дальнейшем если проект получит популярность сложно будет доказать, что он Ваш.
Изображение
Шаг № 4
Выбираем оплатить со счета аккаунта и заказать.
Изображение

Шаг № 5
Все, процедуру прошли, теперь ждем ответа на почту, регистрация проходит в течении 24 часов, то есть у нас есть пока время обдумать как будет выглядеть наш проект.
Изображение

Шаг № 6
Для того чтобы проверить, прошел ли наш домен регистрацию нужно зайти во вкладку сайты.

Изображение
Шаг № 7
И мы увидим там наше доменное имя, если при переходе будет выскакивать ошибка, что страницы не существует, значит домен не зарегистрировался нужно подождать.
Изображение

Позже, когда домен будет зарегистрирован при переходе у нас должно появится приветственное окно бегет. Только когда данное окно появится можно переходить к следующему шагу!
Изображение








Раздел № 4 установка WordPress.

Шаг № 1
Переходим во вкладку CMS
Изображение

Шаг № 2
Ищем WordPress и жмем установить.


Изображение
Шаг № 3
Выбираем логин администратора и пароль, а так же можем ввести свое описание, но последний пункт не обязательно.
Изображение
Шаг № 4
В следующем окне нам нужно записать и сохранить все свои данные в "укромном месте".
Изображение
Шаг № 5
После этого видим такое окно. Переходим на главную страницу. Потом во вкладку сайты.
Изображение

Шаг № 6
Нажимаем на наш сайт. ( на картинке это пример, там должно быть название Вашего сайта).
Изображение

Шаг № 7
И вот. Ура. ура, ура, наш сайт работает.
Изображение







Раздел № 5 два слова о WordPress.


Шаг № 1
Заходим в админ панель, для этого на главной странице нажимаем на вкладку войти.
Изображение
Шаг № 2
Вводим свой логин и пароль который указывали в шаге № 3 раздела № 4.
Изображение
Шаг № 3
Теперь мы видим консоль, в ней вы разберетесь очень быстро. Она написана простым и понятным языком.
Изображение

Шаг № 4
Переходим на главную страницу и теперь мы видим вверху консоль управления сайтом.

Изображение
Шаг № 5
Записи мы будем добавлять через кнопку добавить, но это пока рано, нам нужно выполнить последний раздел по дизайну.
Изображение








Раздел № 6 свой уникальный дизайн.



Шаг № 1
Для того чтобы сделать свой уникальный дизайн, нам нужно скачать в интернете программу Artisteer, если Вы не можете найти рабочую версию пишите мне в ЛС или на почту varebux@gmail.com, я дам Вам рабочую ссылку. Как я уже говорил, первые шаги с данной программой я делал с крякнутой версией и только потом позже купил лицензию. Это все на Ваш выбор.
Шаг № 2
Открываем программу Artisteer и видим такое окно.
Изображение
Шаг № 3
Выбираем шаблон вордпресс.
Изображение
Шаг № 4
И видим наш шаблон в базовой комплектации. Теперь все зависть от нашего воображения и желаний, это программа может практически все. Я думаю вы с легкостью разберетесь в темах, цветах и шрифтах. У меня лишь возникла проблема при создании шапки сайта, так как я хотел сделать что-нибудь уникальное
Изображение
Шаг № 5
Для этого шага нам не нужно качать какой-то софт, вроде фотошопа, я все свои шапки делал с помощью этого сайта http://pixlr.com/editor/?loc=ru. В интернете много информации на это тему, я думаю дальше вы разберетесь если дошли до этого шага и сейчас ваш сайт уже работает. Просто нужно не много времени и терпения. Всем удачи!




Раздел № 7 как сделать уникальную шапку сайта.

Этот раздел я обязательно хочу для Вас написать, потому что это было моей проблемой № 1 при создании своего дизайна!
Покажу на примере работы программы Artisteer и шаблона моего блога.
Шаг № 1
Открываем проект нашего шаблона и например хотим вставить логотип в правый угол. Ищем в интернете картинку, я например хочу вставить логотип cinema 4d. Качаем себе на компьютер
Изображение
Шаг № 2
И вставляем его в шаблон. Вот, что у нас получилось, согласитесь выглядит не красиво? Для того чтобы было все красиво, делаем следующие.
Изображение
Шаг № 3
Переходим на сайт http://pixlr.com/editor/?loc=ru и загружаем нашу, скачанную картинку на данный сайт.
Изображение
Шаг № 4
Вот так.
Изображение
Шаг № 5
Видим такое окно.
Изображение
Шаг № 6
Разблокируем слои, нажав, на "замочек" и должна появиться "галочка".
Изображение
Шаг № 7
Берем "волшебную палочку", и применяем ее на белый фон нашей картинки, должно так выглядеть.
Изображение
Шаг № 8
Жмем кнопку delete на клавиатуре и видим...
Изображение
Шаг № 9
О чудо! Белый фон пропал.
Изображение
Шаг № 10
Теперь сохраняем нашу картинку в формате png, через файл, далее так... png поддерживает прозрачность.
Изображение
Шаг № 11
Сохраняем, вот так.
Изображение
Шаг № 12
Теперь снова добавляем нашу новую картинку в проект.
Изображение
Шаг № 13
Передвигаем в нужное нам место, согласитесь выглядит намного лучше!
Изображение
Шаг № 14
Этот текст был мной сделан точно также, сначала написал в cinema 4d, обработал на сайте http://pixlr.com/editor/?loc=ru и вставил в проект.
Изображение
Шаг № 15
Все остальное шрифт, цвета, расположение блоков, Вы и так сделаете. Можно просто открыть понравившийся сайт, и оттуда взять нужное сочетание.


ИзображениеMaxtrust.ru - сеть по продаже VIP-товаров. Высокий заработок для качественного трафика - от 270$ за 1000 посетителей. Обсудить на форуме.

ИзображениеAdmitad.com - агрегатор партнерских программ с оплатой за действие пользователя. Выбор множества выгодных предложений для вашего трафика. Обсудить на форуме.

 

 

  • 0

#2 WebDoc

WebDoc
  • Пользователь
  • 20 сообщений
  • Репутация: 2

Отправлено 01 Апрель 2012 - 12:30

Отменная статья ! Жаль я раньше не мог прочитать и оплатил хостинг на год в другом сервисе с неделю назад.
Я как новенький скажу: Очень хорошо и подробно написано, без лишнего "мусора", было приятно читать, складывалось ощущение, что со мной общаются в живую, при чём в очень приятной атмосфере.
Обязательно опробую программку Artisteer, весьма заинтересовала.
Посмотрел ваш сайт по поводу 3D Графики, вас мне само провидение послало ^_^ только только решил взяться за освоение After Effecta
  • 0

#3 varebux

varebux
    Topic Starter
  • Пользователь
  • 35 сообщений
  • Репутация: 3

Отправлено 01 Апрель 2012 - 17:55

Спасибо большое. Если, что обращайтесь, помогу!
  • 0

#4 Vohrak

Vohrak
  • Пользователь
  • 9 сообщений
  • Репутация: 0

Отправлено 01 Апрель 2012 - 21:46

Соглашусь, интересная статья, ни строчки не пропустил.
  • 0

#5 varebux

varebux
    Topic Starter
  • Пользователь
  • 35 сообщений
  • Репутация: 3

Отправлено 01 Апрель 2012 - 23:20

Я не успел дописать 7 раздел который касается именно уникальности шаблона, и как все красиво сделать, скрины лежат думаю к концу недели допишу.
  • 0

#6 гвоздь

гвоздь
  • Пользователь
  • 187 сообщений
  • Репутация: 2

Отправлено 01 Апрель 2012 - 23:51

Ну, сделать десяток и более сайтов не составляет трудностей с технической стороны - покупай домены, ставь CMS и клепай сайты. Особенно если учесть, что бесплатных расширений и шаблонов в сети масса. а на счет уникальности шаблона лично я не стал заморачиваться и ломать голову - взял студийный бесплатный и все ОК.

У меня другой вопрос к автору темы - вы по образованию юрист, а ведете 10 сайтов разных напралений и тематик, а материал для них откуда берете - копипаст, рерайт, авторский? Выдавать авторский материал для 10 сайтов различных тематик очень сложно, особенно если есть основная работа... Откуда дровишки?
  • 0

#7 varebux

varebux
    Topic Starter
  • Пользователь
  • 35 сообщений
  • Репутация: 3

Отправлено 02 Апрель 2012 - 00:01

Эти сайты были мною сделаны для моих знакомых, они их и ведут для себя и работы, лично я активно занимаюсь только двумя.
  • 0

#8 гвоздь

гвоздь
  • Пользователь
  • 187 сообщений
  • Репутация: 2

Отправлено 02 Апрель 2012 - 00:10

А, ну тогда понятно. Просто много любителей халявы, котрые на копипасте и рерайте сайты клепают и только засоряют интернет.
  • 0

#9 ureel

ureel
  • Пользователь
  • 6 сообщений
  • Репутация: 0

Отправлено 02 Апрель 2012 - 06:54

хотел спросить, а можно в интернете скачать для себя понравившиесся шаблон и переделать его с помощью программы "Artisteer" ? Я так понял в этой программе только создаешь шаблон в нем предложенный или с нуля так сказать, а меня интересует просто переделать шаблон скачанный из интернета.
  • 0

#10 varebux

varebux
    Topic Starter
  • Пользователь
  • 35 сообщений
  • Репутация: 3

Отправлено 02 Апрель 2012 - 07:05

конечно можно вот здесь к примеру http://www.artisteer...bsite_templates? но проще все сделать с самому там, нет, ничего сложно, я ведь разобрался не имя никаких познаний! и Вы сможете!
  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru