#html #css #wordpress #relative-path
#HTML #css #wordpress #относительный путь
Вопрос:
Я создал блог с WordPress на временном тестовом домене. Я поместил это в основной каталог, а не в папку. Теперь я хочу переместить его на правильный веб-сайт, в папку. Я могу обновить все значения MySQL для URL сайта, и ссылки на относительный путь работают просто отлично.
Проблема в том, что, похоже, я не могу заставить мои ссылки на пути CSS работать. Я понимаю, что моя проблема в том, что они относятся к файлу CSS в теме WordPress, а не к странице. Но как я могу это исправить?
Вот пример:
#topNav {background:#3a93c3 url(wp-content/uploads/2011/07/blueNav.jpg) repeat-x;}
Я попытался добавить ‘./’, ‘../’, и ‘../../’ в начало, но это вообще не работает.
Вопрос
Почему относительные пути не работают в CSS на моем сайте WordPress?
Комментарии:
1. каков абсолютный путь к вашему файлу CSS и к каталогу wp-content?
2. example.com/blog/wp-content/themes/boilerplate/style.css и example.com/blog/wp-content
3. Мой лучший / единственный вариант изменить все на url (/blog/wp-content/uploads/2011/07/blueNav.jpg )?
4. Какой URL-адрес вашего файла css? Вы должны быть в состоянии использовать некоторую комбинацию
../5. Я думаю, проблема в том, что это на сайте WordPress. Никакая комбинация ../ ничего не делает. Например, когда я набираю ../../../ URL в CSS оказывается example.com/blog/wp-content/themes/boilerplate /../../../… . Что, очевидно, не работает.
Ответ №1:
вам действительно не следует помещать изображения темы в папку для загрузки. вам действительно следует хранить изображения вашей темы в папке с темой. Нравится
wp-content/
themes/
mytheme/
images/
1.jpg
style.css
итак, в вашем css вы можете просто сделать
background:transparent url(images/1.jpg);
Комментарии:
1. Я попробую это, просто ради удовольствия, и вернусь к вам через секунду
2. Не сработало. Он изменяет URL на этот: h t t p ://www.example.com/blog/wp-content/themes/boilerplate/../images/blueNav.jpg Обратите внимание, что в URL-адрес вставляется ../.
3. у вас случайно нет базового тега в вашем шаблоне, такого как <base href=» example.com/blog » />
4. о, подождите. я думаю, вы можете просто сделать background: прозрачный url (images/1.jpg );
5. Почему прозрачный фон может помочь?
Ответ №2:
Вы также можете использовать /, который является корнем вашего веб-сайта. Итак, что-то вроде url (/yourfolder/wp-content/…
Если вы хотите использовать относительные пути, вам нужно перейти в нужный каталог. Используя ../, который вы использовали ранее. ../ 1 dir вверх, добавьте еще один .. / 2 dir вверх и так далее.
Комментарии:
1. Относительные пути будут работать в ваших файлах CSS, они надежны как скала. Но вы можете использовать их неправильно. Можете ли вы отредактировать свой вопрос, включив в него более подробную информацию, например, какой URL-адрес относится к файлу css?
2. Я думаю, проблема в том, что это сайт WordPress. Я думаю, что что-то происходит, когда WordPress обрабатывает файл CSS. Я могу заставить относительные URL работать на других моих сайтах, но не на этом.
3. @bozdoz Нет, WordPress определенно не несет ответственности. Это, во-первых, вообще не «обрабатывает файл CSS», таблица стилей включена в
<head>тему, как это было бы на любом старом веб-сайте. Также относительные пути могут использоваться в wp.
Ответ №3:
Я только что просмотрел корпоративный блог моей компании, и у меня есть пара разных способов, была старая тема, которая была устаревшей, и новая тема, которую я создал.
Сначала исходная базовая тема использовала абсолютные пути:
#blogTour {
background: url('http://www.domain.com/wp-content/uploads/2010/09/signup.png');
}
В целом это было не идеально, поскольку мне приходилось настраивать региональные блоги, у них был бы другой URL, и я не хотел использовать переменные PHP ($SERVER [‘DOCUMENT_ROOT’]), но, может быть, вы можете!
В новой теме, которую я создал, я поместил ресурсы в каталог theme…можете ли вы поместить изображения в каталог themes?
#blogFeed {
background: url('_images/icons/blog-feed.png');
}
Наконец, попробуйте обернуть содержимое URL либо обратными ссылками url (‘content’), я помню, где-то читал, что при прокачке CSS через препроцессор (WordPress / PHP) обычно рекомендуется обернуть ваши строки обратными ссылками.
Ответ №4:
Вы можете использовать серверные скрипты в файлах CSS, это позволит вам получить доступ к глобальным переменным вашего веб-сервера и динамически сопоставлять их с любым сервером, на котором вы развертываетесь.
Пожалуйста, смотрите Сценарии на стороне сервера в файлах CSS для шагов по реализации этого.
Комментарии:
1. Это было бы хорошей идеей, но это на сайте WordPress. Я пытаюсь манипулировать уже созданным шаблоном. WordPress, похоже, изменяет URL-адрес с помощью того, как он обрабатывает файлы CSS.
2. Вы можете сделать это с WordPress, просто следуйте инструкциям в ссылке, на которую я ссылался, и в ваших темах WordPress header.php добавьте в таблицу стилей ссылку на css.php файл, и вы будете в деле. Дайте мне знать, если вам нужен пример кода.
3. В целом это хорошая идея, но в этом примере мне намного проще просто выполнить поиск и замену, чтобы создать абсолютные пути в CSS.
Ответ №5:
Старый вопрос, но я вижу, что на самом деле на него нет ответа.
Как упоминалось, загружать материалы, связанные с темой, из wp-content/uploads/ не рекомендуется.
Но, если вы действительно хотите использовать что-то в wp-content/uploads , вы бы использовали:
#topNav {background:#3a93c3 url("../../uploads/2011/07/blueNav.jpg") repeat-x;}
Этот путь будет работать.
При вызове относительного URL из темы php или css базовым становится URL, wp-content/themes/{theme-name}/ поэтому вам нужно создать резервную копию двух уровней каталога ( ../../ ) на wp-content/ .