Как правильно создать корневую папку для сайтов html и ее путь к файлам в ней

Обновлено: 08.07.2024

Корень сайта – это основное понятие, используемое при разработке и обслуживании сайтов. Без умения использовать корневую папку владелец ресурса не сможет ничего добавить к сайту. Он быстро устареет, могут возникнуть различные сбои и проблемы с поисковыми системами. Именно поэтому теме загрузки данных в корневой каталог нужно уделить первоочередное внимание.

Что такое корневой каталог

Корневой каталог это папка, содержащая все файлы на сайте. В неё же добавляют системные файлы. Главное содержимое корневого каталога – файлы. Например, robots.txt, который нужен, чтобы поисковые роботы могли получить инструкции, как найти ресурс в интернете.

При этом, у корневой папки может быть разное название. Для примера:

public_html;
html;
site;
www и т.п.

Название зависит от хостинга, на котором папка расположена.

Если возникли трудности в поиске папки с корнем сайта, можно посмотреть, что в нем есть. Корневой каталог обязательно должен содержать файлы «.htaccess», «robots.txt» и «favicon.ico». Последний файл – это иконка сайта.

Также важно разобраться, что такое корневая папка шаблона. Так как её часто путают с корневым каталогом сайта. Это файлы, которые содержат дизайн сайта. Для примера, в WordPress эта папка будет называться «wp-content > themes > название шаблона».

Если возникают сомнения, узнать корневую папку шаблона можно по файлам. Её содержимое имеет приблизительно следующий вид: «page.php», «header.php», «footer.php», «single.php» и «style.css».

Что касается понятий «корневая папка» или «корневой каталог», во избежание путаницы – это одно и то же.

Где находится корневой каталог

Корневая папка находится на сервере хостинга. Среди наиболее популярных хостингов различают:

WordPress;
OpenCart;
Magento;
Joomla и множество других.

Корневой каталог имеет путь доступа только для владельцев ресурса. Другие лица попросту не смогут войти туда.

Найти корневой каталог можно сразу двумя методами:

Панель управления на хостинге.
FTP-доступ к учетной записи. Нужно установить файловый менеджер вроде FileZilla.

Поиск может вестись любым из вышеперечисленных методов.

Поиск на хостинге

Отыскать корневой каталог можно пройдя такой путь:

в примере открывается папка «domains», где остается выбрать папку с именем сайта, а внутри найти корневой каталог «public.html».

Зависимо от вида хостингов путь к корню сайта немного отличается, но не капитально.

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

Навигация по статье:

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

Что такое абсолютный путь к файлу?

Например, для картинки image.jpg, которая лежит в папке images на вашем хостинге абсолютный путь будет выглядеть так:

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

Посмотреть этот путь можно в адресной строке:

Если изначально у вас путь к файлу в этой строке не отображается, то нужно кликнуть на значок папки, показанный на скриншоте выше.

Как определить абсолютный путь к файлу у себя на хостинге?

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

В этом случае нам нужно:

Потом приписываем к нему скопированный адрес папки с загруженным файлом и в конце пишем название его название и расширение.

Особенности абсолютного пути:

Что такое относительный путь к файлу?

С эти немного сложнее. Относительный путь к файлу указывается относительно расположения того файла в коде которого он указывается. Давайте разберём на конкретных примерах.

Пример 1.
Допустим, мы вставляем картинку в index.html, который лежит в папке с доменом. Там же в папке с доменом находится папка images с нашей картинкой.

Относительный путь будет выглядеть так:

Пример 2.
Нам нужно указать относительный путь к картинке в файле style.css, который лежит в папке CSS. При этом сама картинка находится не папке images.

В этом случае если мы просто напишем /images/image.jpg, как в предыдущем примере, то это не сработает!

Браузер будет воспринимать эту запись так: «Зайди в папку images, которая лежит рядом с файлом style.css и возьми там файл image.jpg». Проблема в том, что в рядом с style.css нет никакой папки images! Она находится на уровень выше.

В таком случае мы должны как бы сказать браузеру: «Сначала выйди из папки CSS, в которой лежит style.css в котором мы указываем наш абсолютный путь, а потом зайди в папку images и возьми там файл image.jpg»

На языке кода команда «выйди из папки» будет выглядеть так: ../

В итоге получим:

Относительный путь указывается относительно того файла в коде которого вы указываете этот путь. То есть вы должны «объяснить» браузеру куда ему нужно идти чтобы найти нужный файл. При этом началом его «маршрута» будет местонахождения того файла, в котором вы пишете код.

Пример 3.

Если нужная картинка лежит рядом с файлом, в коде которого вы пишете путь, то это будет выглядеть так:

Особенности относительного пути:

Определение пути к файлу в WordPress и других CMS

При работе с движками для отображения определённых файлов на сайте вам нужно указывать пути к ним или в админке или коде темы или шаблона.

Если вы вносите правки в коде, то указывать относительный путь вы должны относительно файла index.php который лежит в папке с доменом.

Получается, что вы вносите правки в файле шаблона, но путь должны указывать как будто бы вы работаете с index.php в корне сайта. Такова особенность работы движков.

Если вы указываете адрес внутри скрипта или CSS файла, то путь указывается относительно этого файла.

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

В примере 8.2 показано создание абсолютной ссылки на другой сайт.

Пример 8.2. Использование абсолютных ссылок

Абсолютные ссылки обычно применяются для указания документа на другом сетевом ресурсе, впрочем, допустимо делать абсолютные ссылки и внутри текущего сайта. Однако подобное практикуется нечасто, поскольку такие ссылки достаточно длинные и громоздкие. Поэтому внутри сайта преимущественно используются относительные ссылки.

Ссылки относительно текущего документа

При создании относительных ссылок надо понимать, какое значение для атрибута href следует указывать, поскольку оно зависит от исходного расположения файлов. Рассмотрим несколько типичных вариантов.

1. Файлы располагаются в одной папке (рис. 8.4).

Необходимо сделать ссылку из исходного документа на ссылаемый. В таком случае код будет следующий.

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

2. Файлы размещаются в разных папках (рис. 8.5).

Когда исходный документ хранится в одной папке, а ссылаемый в корне сайта, то перед именем файла в адресе ссылки следует поставить две точки и слэш (/), как показано ниже.

Две точки в данном случае означают выйти из текущей папки на уровень выше.

3. Файлы размещаются в разных папках (рис. 8.6).

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

Аналогично обстоит дело с любым числом вложенных папок.

4. Файлы размещаются в разных папках (рис. 8.7).

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

Заметьте, что никаких дополнительных точек и слэшей перед именем папки нет. Если файл находится внутри не одной, а двух папок, то путь к нему записывается так.

Ссылки относительно корня сайта

Иногда можно встретить путь к файлу относительно корня сайта, он выглядит как "/Папка/Имя файла" со слэшем вначале. Так, запись <a href="/course/">Курсы</a> означает, что ссылка ведет в папку с именем course, которая располагается в корне сайта, а в ней необходимо загрузить индексный файл.

Учтите, что такая форма записи не работает на локальном компьютере, а только под управлением веб-сервера.

Создание сайта. Продвижение сайта. Заработок на сайте.

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

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

Что такое корневая папка сайта?

Если вам хоть что-то говорят такие фразы как: файл robots.txt, .htaccess или index.html и прочие, то вы наверняка сталкивались с необходимостью загрузить файлы в корень сайта (корневую папку).

Еще раньше вы могли столкнуться с поиском корневой папки в процессе установки CMS, например, WordPress, или подтверждая права на управление сайтом.

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

Именно папка с названием public_html (для нашего проекта) и является корнем сайта. Сюда и нужно будет загружать все необходимые файлы, подтверждающие мета-теги на права сайтом.

Мы, например, когда устанавливали cms, загружали wordpress именно в корневую папку сайта.

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

Тогда у вас есть вариант использовать ftp доступ к серверу хостинга, если он поддерживает такую возможность.

Использование ftp доступа к хостингу для загрузки файлов в корень сайта

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

Сначала скачайте какой-нибудь менеджер ftp, например, FileZilla. Установите программу и войдите в неё.

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

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

Спасибо за внимание. Будем очень благодарны, если воспользуетесь кнопочками социальных сетей.

Читайте также: