Как на сайте создать папку с файлами
Корень сайта – это основное понятие, используемое при разработке и обслуживании сайтов. Без умения использовать корневую папку владелец ресурса не сможет ничего добавить к сайту. Он быстро устареет, могут возникнуть различные сбои и проблемы с поисковыми системами. Именно поэтому теме загрузки данных в корневой каталог нужно уделить первоочередное внимание.
Что такое корневой каталог
Корневой каталог это папка, содержащая все файлы на сайте. В неё же добавляют системные файлы. Главное содержимое корневого каталога – файлы. Например, 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».
Зависимо от вида хостингов путь к корню сайта немного отличается, но не капитально.
Существует, как минимум три способа создать папку на сервере!
Сделать папку на сервере используя php → mkdir(make directory).
Создать папки на сервере с помощью программы.
Способ создания папки на сервере - это простое перетаскивание!
Сделать папку на сервере сайта.
Первый способ создания папки на сервере
Максимально подробно данный способ создания папки на сервере описан тут.Для того, чтобы сделать папку на сервере(програмно) нам потребуется:
Первое в этом способе мы должны правильно прописать правильно путь до папки - также на сервере.
Не буду подробно рассказать всё, что можно прочитать по выше идущей ссылке, повторим вкратце - нам нужен путь до корневой это :
Выведем этту глобальную($_SERVER) переменную через echo
Как живой пример мы рассматривали картинку логотипа. Предположим, что мы хотим создать новую папку именно в этой папке, в которой и лежит данный файл :
Убираем из этого пути домен и название файла. Добавляем полученный огрызок пути и добавляем к выше приведенной переменной. И получим путь до папки на сервер, где лежит данная картинка.
Функция, которая умеет создавать папки на сервере.
У нас есть путь, у нас есть функция. Теперь надо скормить путь нашей функции:
Второй способ создания папки на сервере
Будем делать папку на сервере в программе.
Вам понадобится(в любом случае) программа для передачи файлов на сервер, например такая.
Открываем программу, соединяемся с сервером, наводим мышку туда, где собираемся создать папку на сервере, нажимаем ПКМ, в выпавшем окне выбираем создать каталог.
Второй способ создания папки на сервере
После этого вам нужно назвать вашу новую создаваемую папку на сервере
ВСЁ! Наша новая папка на сервере создана с помощью программы!
Второй способ создания папки на сервере
Третий способ создания папки на сервере
Аналогично, что и в первом варианте создания папки на сервер, нам потребуется эта же программа, либо любая другая, которая так умеет, перемещаемся на левую сторону программы. где - мы видим наш проводник, как на компьютере - опять нажимаем ПКМ - и повторяем все те манипуляции, что и в первом случае!
Третий способ создания папки на сервере
Когда вы создали новую папку, то просто берем и перетаскиваем новую папку с компьютера на сервер! Папка на сервер создается автоматически под этим же названием!
Третий способ создания папки на сервере Логично спросить
Зачем нужен третий способ создания папки на сервере - если видно, что придется сделать на несколько телодвижений больше!?
Например, вам нужно сделать несколько папок, в одной папке, и еще поместить туда несколько файлов, логично, что намного легче переместить одну папку на сервере с десятком папок внутри, чем создавать заново каждую новую на сервере!
У вас должна быть папка для каждого клиента, не связанная с проектом, который вы сейчас для него делаете. Внутри этой папки должна быть папка для каждого проекта. Изначально у вас будет только папка под названием website/, но в скором времени у вас появятся еще такие папки, как logo/, reports/, competitive analysis/ и пр. Также имеет смысл сложить в эту папку файлы дизайна, вероятно, создав для них подпапку design/ или graphics/.
Не открывайте доступ к этой папке для Apache. В ней будет храниться чувствительная информация. В зависимости от используемого средства разработки, вы можете выбрать либо хранить код в этой папке, либо вынести его за рамки папки сайта. Можно назвать ее code/ или, если вы считаете, что для других проектов будет отдельный код — website-code/. Если большинство других ваших проектов связаны с дизайном или бизнесом, тогда, вероятно, в них вообще не будет кода, кроме случайного скрипта, для которого вообще не нужна отдельная папка.
В общем, вот пример структуры, которую мы только что построили:
А теперь поговорим о папках “code/” и “website/”, описанных выше
Существует два типа изображений (практически всегда): те, которые являются частью дизайна, и те, которые являются частью контента, представленного на сайте. Последние должны находиться в папке ресурсов (или загрузок, или мультимедиа), например, в подпапке pictures/. Картинки дизайна, которые вряд ли придется часто искать, можно положить в папку images/.
Если ваш дизайн немного более сложный, у вас должны быть изображения для кнопок, значков, навигации, фона страницы и пр. В таком случае, в этой папке у вас скоро появится от 10 до 20 изображений, поэтому стоит разбить ее на подпапки. Все равно неплохо бы иметь изображения общего назначения в папке верхнего уровня, но при этом подпапки помогут контролировать огромное количество ваших мелких файлов. Давайте файлам чувствительные и легко запоминаемые имена, например form-warning-icon.jpg.
Для большинства сайтов таблицы стилей не должны быть очень большими. Для небольшого сайта или даже для более крупного сайта без большого количества различных разделов (у каждого из которых свой дизайн), вам обычно достаточно одного файла для CSS. В таком случае его можно просто назвать main.css или styles.css.
Несмотря на это, многие любят разбивать таблицы стилей на несколько файлов. Есть несколько способов, как это сделать. Наиболее популярный вариант – это одна таблица для разметки, одна для шрифтов и еще одна для цветов. Идея неплохая, но на практике это усложняет управление – вы погрязнете в назначении большого количества классов по 3 (или более) раза, а отслеживание багов может стать ночным кошмаром.
Я считаю, что лучше разделить стили для «разметки» и «контента». «Разметка» будет включать такие элементы, как навигация, колонтитулы, боковые панели, поля, разделы. «Контент» будет включать такие элементы, как абзацы, заголовки, цитаты, списки, плавающие изображения, ссылки. Двигаясь дальше, имеет смысл создать файл стилей «формы». Однако, так как контент в сети становится все более интерактивным, черта между формами и контентом довольно быстро стирается.
Опять же, называйте вещи своими именами, а потому эти файлы лучше назвать layout.css, content.css и forms.css. Если вы решите дать им более неточные названия, вроде presentation.css, model.css,page.css, вам каждый раз придется думать, прежде чем решить, какой файл нужно открыть.
Иногда полезно иметь отдельные CSS-файлы для отдельных страниц, у которых есть собственные требования к дизайну. Но это может оказаться себе дороже, в зависимости от сложности такой страницы. Если вам приходится щелкать по вкладкам в редакторе в поиске нужного CSS-файла для определенного элемента, наверное, лучше все же упростить CSS. Также не помешает подумать об использовании Sass или LESS, чтобы сделать CSS более привлекательным и чистым. Возможно, у вас также будут отдельные таблицы стилей для различных мультимедиа-файлов, и они уж точно должны быть отдельным файлом. Ну и, как обычно, им следует дать чувствительное название, например, print.css.
Если у вас несколько файлов CSS – это прекрасно, но, прежде чем их преподнести, объедините их в один с помощью автоматизированного инструмента, иначе скорость загрузки вашего сайта будет очень печальной. Не объединяйте свои превосходно разложенные CSS вручную. Компьютер сам это легко сделает с помощью шахматного автомата. Для этого можно использовать Minify (PHP) или Juicer(Ruby).
Между организацией файлов JavaScript и CSS для большинства сайтов много общего. У них похожие (но разные) функции, они оба преподносятся браузеру для интерпретации, они оба взаимодействуют с DOM (если правильно используются), а также они часто взаимодействуют между собой. JavaScript часто используется для добавления функциональности тому же набору элементов, которые используются в CSS для создания стиля.
Обычно вы приходите к тому, что у вас есть файл библиотеки JavaScript (jquery.js, mootools.js и пр.), несколько виджетов (скажем, datepicker.js и dropdown.js) и несколько файлов кода для каждого сайта (например, my-image-slider.js). Определенно имеет смысл хранить всю эту информацию в отдельных файлах, однако у вас зачастую есть немного JavaScriptа для сайтов, что имеет смысл создать для него всего один файл.
Положите все эти файлы в папку под названием javascript/. Если вы используете стороннюю библиотеку вроде jQuery, вы крайне редко будете создавать настолько сложные сайты, чтобы была необходимость разделять эту папку.
Конечно, в ваших шаблонах может быть случайный кусок читабельного для человека текста, например, для кнопки, выпадающего меню и прочего. Это нормально – такой текст, как правило, тесно связан с функцией на странице, а не с контентом.
Папки помогают группировать материалы, загруженные в библиотеку ресурсов, и создать на сайте нечто вроде каталога файлов. Если вы хотите разместить множество файлов для скачивания на нескольких страницах сайта, то просто положите документы для одной страницы в одну папку, а для другой — в другую. Таким образом, вам не придется прокручивать длинный список картинок и файлов в поисках нужного.
Если материала очень много, и вы хотите его структурировать, то можно создавать папки внутри папок.
Чтобы создать папку, сперва войдите в библиотеку ресурсов, выбрав соответствующий раздел на панели управления сайтом (слева).
Для добавления папки нажмите на стрелку справа от кнопки «Загрузить изображение» и выберите пункт «Создать папку».
Придумайте для папки название. Оно будет использоваться только в библиотеке ресурсов: на сайте наличие этой папки никак не отобразится. Затем сохраните изменения.
После этого папка будет добавлена в библиотеку ресурсов. Чтобы загрузить в нее файлы или изображения, зайдите внутрь папки, кликнув по иконке слева от ее названия. Затем действуйте в соответствии с инструкцией по добавлению картинок в библиотеку ресурсов или руководством по загрузке файлов на сайт.
Также вы можете переместить в созданную папку уже имеющиеся в библиотеке файлы. Для этого выделите нужные файлы и изображения галочками (они окрасятся в синий цвет) и нажмите кнопку «Переместить» в верхней части страницы.
Система спросит, куда вы хотите переместить выбранные элементы: кликните мышью по названию созданной вами папки и нажмите «Выбрать».
Читайте также: