Как установить музыку на сайт или блог за несколько минут? Пошаговая инструкция.

musyka-na-saite-blogeПриятно зайти на какой-либо сайт или блог, где установлена красивая расслабляющая музыка, и читать не "в сухую", а с элементом релаксации. На таком интернет-ресурсе просто, как говорится, "зависаешь".

P.S. Заметка написана уже давно, поэтому, чтобы долго не мучиться (и если вам нравится вид плеера на моих страницах), установите компактyый плагин Compact WP Audio Player и настройте его. Если день настраивать, стандартный код найдете в моих комментариях внизу. А заодно и свой коммент оставьте, плиз! Удачи!

Долгое время я лишь по хорошему завидовала, а потом "загорелась" установить музыку и на своем блоге, а также на своих одностраничных сайтах.  Прочитала уйму статей и уже было отступила, так как везде предполагалась работа с html-кодом. Я уважаю html-код ровно до той степени, когда его нужно  просто  скопировать и в нужное место вставить. Стараюсь всегда совершать минимум усилий, в потому все, о чем пишу, требует, как правило, пару-тройку минут вместе с изучением. И вот неожиданно на одном из факультативов совсем на другую тему мне попался такой вот чудо-конструктор!
Здесь основное время уходит на то, чтобы найти в интернете подходящую музыку в mp3-формате. Как искать и скачивать музыку я объяснять не буду, так как сейчас это любой ребенок может сделать. Будем считать, что  такой mp3-файл у вас на компьютере уже есть. Далее, по шагам:

1. Заходим в конструктор по ссылке: https://www.flv-mp3.com/ru/mp3/. И здесь вы видите строку для konstruktor musyki na sajtзаполнения, куда нужно вставить прямую ссылку на mp3-мелодию, то есть ее адрес в Интернете. Если такая ссылка у вас есть, то переходите сразу к пункту 3. Однако не всегда эту ссылку так просто получить. Скачать музыкальный файл легко, а вот ссылку получить - нет. Кроме того, если хозяин уберет ее с текущего адреса, то и вы останетесь без мелодии. Поэтому давайте рассмотрим случай, когда уже имеющуюся на вашем компе мелодию нужно поместить обратно в Интернет, но теперь уже на "хозяйских" правах, и получить необходимую прямую ссылку.

jino fajlovyj menedger2. Я опишу свой вариант, когда доменное имя создано на хостинге Джино (Jino). Однако думаю, что аналогично можно создать ссылку и на любом другом хостинге. Главное, понимать смысл. Итак, вводим логин-пароль и заходим в Контрольную панель - Файловый менеджер. Открываем папку domains и создаем субдомен. Я создала папку с именем music.multi-marin.ru. У вас он, понятно, будет свой. Внутри субдомена music.multi-marin.ru создаем папку, куда будем помещать музыкальные файлы. Я назвала ее relax  и буду помещать туда только приятную релаксирующую музыку. Для другого типа музыки создам новую папку. Главное, чтобы самому было ясно, какого жанра mp3 файлы там находятся. И наконец, выбираем на компьютере свой музыкальный файл и загружаем его в папку relax. Теперь требуемая прямая ссылка на музыкальный файл у нас в руках!nastroyki-pleera

3. Возвращаемся к нашему конструктору п.1. Теперь нам надо правильно задать параметры сборки. Моя прямая ссылка выглядит следующим образом: https://music.multi-marin.ru/relax/Muzyka-super.mp3. У вас она будет, понятно, своя, но в ней должно присутствовать имя субдомена, имя папки с музыкой и имя самого музыкального файла.
- Сопроводительную Надпись я задала только страницах Об авторе и Личный контакт. А вот Размеры плеера я всегда задаю разные, по умолчанию это 470х70, как на моей странице Об авторе. Также я отмечаю в cvet-pleeraАвтозапуске опцию Да, чтобы музыка начинала играть сразу же при открытии страницы.
- Цвет плеера по умолчанию задан белый, поэтому, если вы хотите внести сюда элемент творчества, то здесь два варианта. Либо выбрать какой-либо цвет из выпадающего меню. Например, на своей странице Содержание я выбрала серый цвет. По желанию можно выбрать и более продвинутую цветовую гамму skin-pleeraиз предложенных Скинов. Я выбрала скин gold для своей страницы Личный контакт и скин pattern1 для страницы Об авторе. Можно загрузить и свой собственный скин, но я этим заниматься не стала. Теперь, чтобы получить html-код, нужно щелкнуть по красной виртуальной кнопке внизу конструктора!

html-kod-pleera4. Чтобы не потерять какого-либо элемента html-кода выделяем его следующим образом. Щелкаем правой клавишей мыши по окну с кодом и в выпавшем окне выбираем строчку Выделить все. Видим,что все поле окрасилось синим цветом и снова щелкаем правой клавишей мыши в любом месте кода и выбираем в выпавшем окне функцию  Копировать. Здесь же мы видим общий вид плеера и слышим музыку. По кнопке Редактировать можно вернуться и внести необходимые изменения. Советую при этом  обратить особое внимание на опцию Автозапуск, так как при возврате она сбрасывается на стандартное значение Нет.

5. После того, как html-код скопирован идем на свой сайт или блог и вставляем этот код в нужноеhtml-kodovaya-chast'-tekst место. Независимо от того, на каком движке установлен ваш блог, или в какой программе сделан одностраничник, важно помнить, что вставку кода всегда производим в кодовой части, а не в визуальном режиме. Мой пример на скриншоте сделан для движка WordPress. Обратите внимание на открывающий и закрывающий теги <object> </object>. Они являются началом и концом вставленного кода.Таким образом, если вам не понравилось расположение плеера, можно скопировать весь html-код, включая теги <object> </object> и переставить в новое место, уже не обращаясь к конструктору плеера. Если вам понадобилось отцентрировать ваш плеер, то добавляете vneshnij vid pleeraоткрывающий и закрывающий теги <center></center> в самом начале и в конце кода. При этом, как видно из скриншота, в визуальном режиме плеер будет выглядеть совсем не так, как в режиме Просмотр, поэтому не пугайтесь и переходите в режим просмотра. На всех своих страницах я поместила плееры разного размера, цвета и в разных местах специально для примера и буду признательна за обратную связь, какой плеер наиболее "экологичен", если можно так выразиться?

Желаю приятного творчества!

Марина Гай

About Марина Гай

"В этом мире богатыми нас делает не то, что мы получаем, а то, что мы отдаем" - Генри Уорд Бичер. Будем богаче во всех отношениях!
This entry was posted in Разный личный ОПЫТ and tagged . Bookmark the permalink.
 

33 комментариев к Как установить музыку на сайт или блог за несколько минут? Пошаговая инструкция.

  1. Здравствуйте. Сколько не пытался, музыка на blogspot.com не работает. Все делаю по инструкции. Но кроме трёх символов, которыми я обозначил сам плеер, ничего не вижу и не слышу. Не понимаю почему?

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

  2. Вадим says:

    Доброго времени суток Марина! Очень понравилось как вы доступно все изложили в этой статье. У меня все получилось! Спасибо!Остался один вопрос: Как сделать плеер невидимым на сайте, но чтобы музыка играла при входе? Прошу Вас поделиться если знаете!

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

      • Вадим says:

        Марина, да мне понравился плеер на вашей странице, скиньте пожалуйста код!

    • Вадим, я подзабыла слегка, все ж так быстро меняется в Интернете! Сначала нужно установить плагин Compact WP Audio Player, он есть в списке стандартных плагинов WP. А код выглядит так, чтобы не вникать в настройки плагина (хотя можете и вникнуть;):
      [sc_embed_player autoplay=true volume="20" fileurl="https://music.multi-marin.ru/relax/zvuki-prirody.mp3"]
      Разумеется, нужно вставить свой URL после оператора fileurl=» «

  3. я says:

    Здравствуйте. Скажите пожалуйста, куда именно вставлять html-код? Никак не могу понять, в каком смысле «в нужное место» и где это место найти? Заранее спасибо.

    • Имеется ввиду в нужное место в кодовой части на вашем блоге или сайте. Вы же можете вставить этот музыкальный плеер и вначале, и в конце, и в середине статьи. Верно ведь? Но не в визуальной ее части, а именно в кодовой! У меня блог размещен на движке WordPress, но уверена, что и другие платформы построены аналогичным образом:)

  4. Юдифь says:

    Здравствуйте! Я уже третью неделю пытаюсь вставить музыку на музыкальную открытку. Я тоже на Джино. Попробую по-Вашему. Если получится, то сделаю для Вас музыкальную открытку. Спасибо. ioudifm@gmail.com

    • Должно получиться, Юдифь! Тем более, что по большому-то счету технология от хостинга не так уж и зависит, просто я описала все на примере Джино, что называется, делала сама и сразу записывала! Так что буду ждать Вашу открытку!

      • Юдифь says:

        Мариночка! Я рано обрадовалась. Получается все тот-же прямоугольник с красным крестом. Уже не знаю, что делать. Больше нервов и времени нет. Открытку бы я сделала, но она без музыки не имеет смысла.С уважением, Юдифь.

        • Юдифь, найдите меня завтра в Скайпе m.v.g.aqua, сделаем все вместе с разделением экрана, не страдать же почем зря! Только у нас разница во времени 4 часа, так что ближе к вечеру с учетом воскресенья:)А сейчас у нас уже глубокая ночь!

  5. FKTRC says:

    ДЛЯ МЕНЯ ЭТО ВЫСШИЙ ПИЛОТАЖ

  6. Спасибо, Марина! Очень кстати Ваши советы! Успехов!

  7. Galina says:

    Застолбила ссылку на статью Скоро понадобится на новый сайт

  8. Людмила Енеровская says:

    Ну надо же! Наконец-то нашла эту тему. Теперь буду знать куда заглянуть, если что-то не получится. Спасибо.

  9. Нина says:

    Марина, зашла к Вам просто познакомиться (с Блоговодства Ирины Смирновой) и неожиданно нашла для себя такую ценную фишку. Очень нравится, хочу установить у себя на блоге. Жаль, правда, что это не везде будет уместно, ведь у меня блог по моделированию одежды. Но все равно где-нибудь обязательно вставлю музыку. Это очень здорово! Когда установлю, приглашу Вас послушать. А если моя тема Вам интересна, то заходите в гости без приглашения. Буду рада. Всех благ Вам и удачи!

  10. Елена Бронзинская says:

    Марина, я не встречала такой информации. Инструкция по установке музыки подробная, четкая и ясная.

  11. Марина, а как это выглядит на блоге, так сказать «в готовом виде»?

    • Так,Мария, я прежде чем писать, установила музыку у себя аж на 3-х страницах: Содержание, Об авторе и Личный контакт.Зайдите на любую, послушайте музыку и посмотрите, как выглядят плееры!Благодарю за проявленный интерес!

  12. fakelq says:

    заманчиво, конечно, но не будет ли это снижать скорость загрузки блога?

    • Лена, такой вопрос возник и у меня. На Ваш просвещенный взгляд, мой блог грузится долго? Я, честно, говоря не заметила изменений. Гораздо больше на скорость загрузки влияет размер загружаемых нами картинок. Вот на что нужно обращать самое серьезное внимание! Благодарю за отзыв!

      • Елена Красько says:

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

        • Я это, Елена,поняла с самого начала, когда Вы мою фотографию на блоге раскритиковали в пух и прах!:))посмотрела на нее Вашими глазами и убрала:)посмотрела внимательно на Вас,Вашу асимметричную стрижку и подумала:»Да, очень мы с этой зеленоглазой девушкой чем-то похожи!»:)

  13. Нина Байкулова says:

    Ох, Марина! У меня ,аж, мозги скрипят. Но хочется понять. Я думаю, ваше пошаговое руководство поможет это сделать. Планирую страничку «Медики шутят» с музыкальным сопровождением. Наверное, придется ее спрятать от поисковиков.

    • Нина,не поняла,зачем страничку от поисковиков прятать? А инструкция что,не понятная получилась?Я делала и сразу писала, причем проделала все несколько раз, так как установила музыку в «промышленных масштабах» на всех страницах!:)Напишите,пожалуйста, когда установите музыку, я загляну обязательно:)

  14. oxanadevi says:

    Мне пару раз попадались сайты с мелодиями, но я даже и не мечтала разобраться в таких настройках, думала все сложно, а вы так подробно все объяснили! Спасибо, может и надумаю! 🙂

  15. Лариса says:

    Марина, привнесли разнообразие, мне понравилось. У Вас всегда «изюминки», что-то необычное. Осталось за малым — разобраться со всем этом…

  16. Привет,Марина.Я тоже давно ищу возможности внести в свои странички муз.сопрвождение.Но рано обрадовалась,когда нашла у вас статью.дошла вот до этих пор:Внутри субдомена music.multi-marin.ru создаем папку (опционно) и ступор…Что значит-опционно?Помогите,спасите,хочу музыку…

    • Земфира, дорогая! Вообще опционно значит необязательно! Однако папку эту внутри субдомена создавать просто 100% необходимо, так как без этого плеер не работает! Только что после Вашего комментария специально проверила и в статье все исправила! Так что спасибо Вам огромное за не напрасно поднятую тревогу!Благодарю! Скиньте ссылку, когда музыку установите, зайду в гости обязательно!

      • zemfira says:

        Марина,благодарности моей Вам нет границ!!!Автозапуск вроде отметила » ДА»,но не запустилась мелодия сама.Буду дорабатывать,но смысл понятен.Просто «ВАУ».https://service.mlm-zemfira.ru/ Удачи вам,буду ходить к вам за позитивом и знаниями.

        • Земфира,очень-очень приятно получить такой комментарий!Посмотрела Вашу позитивную страничку, Ваш золотой:) плеер работает пока только на ручном запуске, и он стоит в самом конце,так что вряд ли кто-то вообще поймет,что делать. Проверьте еще раз активацию Автозапуска, так как при редактировании конструктор почему-то сбрасывает эту настройку.Но дело уже совсем за малым! Очень рада за Вас! Упорные всегда достигают результата!

Добавить комментарий

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.