CSS не отображается на моем сайте, отображается только HTML.

Содержание

Вопрос или проблема
Ответ или решение
1. Проверка пути к CSS
2. Настройки WordPress
3. Настройки .htaccess
4. Регистрация и подключение CSS
5. Правила доступа и права на файлы
6. Проверка кэширования
7. Проверка на других устройствах
Заключение

Вопрос или проблема

Я очень новичок в WordPress. Я недавно установил его на свой сервер Linux и загрузил на него тему. Все выглядит хорошо в моем браузере, однако, если я пытаюсь получить доступ к веб-сайту вне моей сети, я вижу только текст, а не CSS. Я прочитал все разные форумы для решения проблемы, но моя проблема все еще сохраняется. Вот мой .htaccess

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Я изменил права доступа на 755 и 777, перезапустил Apache, но проблема осталась.

Проверьте, правильно ли вы указываете файл CSS. Как он вызывается?

URL должен быть примерно таким: ht|tp://yoursite.com/wordpress/wp-content/themes/yourtheme/style.css. Вы найдете, что он загружается как ht|tp://localhost/, и поэтому он будет загружаться правильно на вашем компьютере, но не у кого-то другого.

Посмотрите в инструментах разработчика на URL style.css

Вы пробовали зарегистрировать скрипт? Пример кода

 wp_register_script('jquery', get_template_directory_uri() . '/assets/all.js', false, null);
wp_enqueue_script('jquery');
wp_register_style('all', get_template_directory_uri() . '/assets/all.css', false, null);
wp_enqueue_style('all');

Если вы установили его в какую-то папку, то ваш файл htaccess должен выглядеть так

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /yourfoldername/     -----> Эта строка
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /barter3/index.php [L]
</IfModule>

# END WordPress

Если вы видите текст, тогда .htaccess может не быть проблемой.

Можете открыть URL в браузере Chrome, щелкнуть правой кнопкой мыши, выбрать “Проверка элемента”, сеть
-> Теперь обновите страницу еще раз. Вы увидите вкладку стилей в сети.
Нажмите на нее, она покажет URL, который вы запрашиваете для CSS. Подтвердите, что ваш URL правильный.

Вам нужно ввести полный хостнэйм и суффикс .local в поля “Адрес WordPress” и “Адрес сайта”.

Например, http://raspberrypi.local

Перейдите в “Общие настройки” и установите “адрес WordPress” и “адрес сайта” с вашего локального адреса на ваш доменный адрес…

Ответ или решение

Если ваш CSS не отображается на веб-сайте WordPress вне вашей локальной сети, а виден только текст, это может быть связано с несколькими причинами. Давайте разберем ваш случай подробно и шаг за шагом.

1. Проверка пути к CSS

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

http://yoursite.com/wp-content/themes/yourtheme/style.css

Если во время разработки вы использовали http://localhost/, то когда кто-либо другой попытается открыть ваш сайт, он не найдет локальный адрес. Это приведет к отсутствию стилей. Чтобы проверить это:

Откройте инструменты разработчика (F12 в большинстве браузеров).
Перейдите на вкладку "Сеть" (Network) и перезагрузите страницу.
Посмотрите на запросы к стилям (CSS) и убедитесь, что они корректные.

2. Настройки WordPress

Убедитесь, что адрес вашего сайта и адрес WordPress (WordPress Address и Site Address) установлены правильно. В административной панели WordPress перейдите к Настройки -> Общие и проверьте эти поля. Если они ссылаются на локальный адрес, измените их на полный адрес вашего сайта, например:

http://yourdomain.com

3. Настройки .htaccess

Ваш файл .htaccess может требовать дополнительных настроек, особенно если вы установили WordPress в подпапку на вашем сервере. Убедитесь, что ваш файл выглядит примерно так, если WordPress находится в подпапке:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /yourfoldername/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /yourfoldername/index.php [L]
</IfModule>
# END WordPress

4. Регистрация и подключение CSS

Проверьте, правильно ли вы регистрируете и подключаете CSS в вашем файле functions.php темы. Используйте следующий код как пример:

function enqueue_styles() {
    wp_enqueue_style('your-theme-style', get_template_directory_uri() . '/style.css');
}
add_action('wp_enqueue_scripts', 'enqueue_styles');

Убедитесь, что путь к файлу CSS правильный.

5. Правила доступа и права на файлы

Вы упомянули, что изменили права на файлы на 755 и 777. Обратите внимание, что для файлов CSS и изображений обычно достаточно прав 644. Однако папки могут требовать 755. Убедитесь, что веб-сервер (обычно это Apache или Nginx) имеет необходимые разрешения на чтение файлов.

find . -type d -exec chmod 755 {} \;  # для папок
find . -type f -exec chmod 644 {} \;  # для файлов

6. Проверка кэширования

Если вы используете плагины кэширования (например, W3 Total Cache или WP Super Cache), попробуйте очистить кэш, так как это может предотвратить отображение ваших последних изменений.

7. Проверка на других устройствах

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

Заключение

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