Custom CSS Not Recognized After Theme Update

Resolved sakis2019
(@sakis2019)

2 years, 4 months ago

Hello OceanWP Support,

I’ve been using OceanWP with a child theme, and since the recent update, it seems that the custom CSS in the style.css file is not being recognized or applied.

Is there a specific step or adjustment that needs to be made to accommodate the changes in the recent update? I would appreciate any guidance or assistance you can provide to resolve this issue.

Thank you for your time and support.

Best regards,

Sakis

Viewing 6 replies - 1 through 6 (of 6 total)

(@skalanter)

Hello @sakis2019,

Thank you for reaching out,

I fully examined the issue you have raised on this topic and could not see it on my end: https://postimg.cc/N2wZ3NQq. How can we replicate your steps to arrive at the issue on a fresh WordPress installation?

By the way, you can put all your custom CSS in Customizer > Custom CSS/JS > CSS. If you use the original child theme, there isn’t any issue: https://docs.oceanwp.org/article/90-sample-child-theme.

However, if you changed it or use your own child theme, you can follow the following article to include your desired CSS/JS files in the child theme: https://developer.ww.wp.xz.cn/themes/basics/including-css-javascript/.

I hope it helps.
Best Regards

Thread Starter

sakis2019

(@sakis2019)

2 years, 4 months ago

Thank you very much for your help.

As mentioned earlier, this is not a new installation but rather an existing WordPress instance that has been running smoothly for years. I cannot confirm with 100% certainty that the issue is stemming from OceanWP; it’s also possible that a plugin is causing the problem. The last plugin I installed was Litespeed Cache, but even then, I cannot definitively attribute the issue to that specific plugin. Unfortunately, I’m unsure how to effectively “troubleshoot” the problem and would greatly appreciate any tips.

Best regards
Sakis

Shahin

(@skalanter)

2 years, 4 months ago

Hello @sakis2019,

Thank you for reaching out,

I know your site is not a fresh WordPress installation. The issue you have raised on this topic is not happening on my end.
In order to better understand the issue, we need to know how to reproduce it in another installation. Then we can understand it and will provide a solution for it.

So, kindly explain to us step by step how we can reproduce the issue so we can recreate it somewhere other than your website.
For example, if you are using custom code, share the code and tell us where you put the code.

Also, please provide us with your system environment information. To do this, please go to WP Dashboard > Tools > Site Health > Info Tab and click on the button Copy site info to clipboard. You can send the information as code here or upload them to http://pastebin.com/ and get an exclusive link: https://i.postimg.cc/fbjtkFyJ/image.png (you can remove your email address from the content).

Before sending these, please make sure that:
Everything on your website is running the latest versions (WP, theme, plugins). If possible, perform a basic troubleshooting checkup method and make sure the issue is related to our theme or plugin(s). To do this, deactivate all other plugins then activate them one by one and check for this issue. Continue doing this until you find what product is causing a conflict with our product. Then provide the details as explained above.

I hope it helps.
Please keep us posted.
Best Regards

Thread Starter

sakis2019

(@sakis2019)

2 years, 4 months ago

Unfortunately, I don’t know how to reproduce this anymore. Attached is the report from the system:

` wp-core

version: 6.4.2
site_language: de_DE
user_language: de_DE
timezone: Europe/Berlin
permalink: /%postname%/
https_status: true
multisite: false
user_registration: 0
blog_public: 1
default_comment_status: open
environment_type: production
user_count: 2
dotorg_communication: true wp-paths-sizes

wordpress_path: /home/u438600120/domains/sakis.tech/public_html
wordpress_size: 421,95 MB (442446395 bytes)
uploads_path: /home/u438600120/domains/sakis.tech/public_html/wp-content/uploads
uploads_size: 201,54 MB (211329716 bytes)
themes_path: /home/u438600120/domains/sakis.tech/public_html/wp-content/themes
themes_size: 27,05 MB (28361560 bytes)
plugins_path: /home/u438600120/domains/sakis.tech/public_html/wp-content/plugins
plugins_size: 134,32 MB (140840575 bytes)
database_size: 18,92 MB (19841024 bytes)
total_size: 803,78 MB (842819270 bytes) wp-active-theme

name: OceanWP Child (oceanwp-child)
version: 1.0
author: Nick
author_website: https://oceanwp.org/
parent_theme: OceanWP (oceanwp)
theme_features: core-block-patterns, widgets-block-editor, align-wide, wp-block-styles, responsive-embeds, editor-styles, editor-style, menus, post-formats, title-tag, automatic-feed-links, post-thumbnails, custom-header, custom-logo, html5, woocommerce, wc-product-gallery-zoom, wc-product-gallery-lightbox, wc-product-gallery-slider, customize-selective-refresh-widgets, widgets
theme_path: /home/u438600120/domains/sakis.tech/public_html/wp-content/themes/oceanwp-child wp-parent-theme

name: OceanWP (oceanwp)
version: 3.5.3
author: OceanWP
author_website: https://oceanwp.org/about-oceanwp/
theme_path: /home/u438600120/domains/sakis.tech/public_html/wp-content/themes/oceanwp wp-themes-inactive (1)

Twenty Twenty-Four: version: 1.0, author: Das WordPress-Team wp-mu-plugins (3)

Disable Auto Updates: author: (undefined), version: (undefined)
Health Check Troubleshooting Mode: author: (undefined), version: 1.9.1
Independent Analytics Performance Booster: version: 1.0, author: Independent Analytics wp-plugins-active (20)

Antispam Bee: version: 2.11.5, author: pluginkollektiv
Borlabs Cookie - Cookie Opt-in: version: 2.2.67, author: Borlabs GmbH
Disable Lazy Load: version: 1.9, author: Jeff Starr
Elementor: version: 3.18.3, author: Elementor.com
Health Check & Troubleshooting: version: 1.7.0, author: The ww.wp.xz.cn community
Highlighting Code Block: version: 2.0.1, author: LOOS, Inc.
Independent Analytics: version: 2.1.4, author: Independent Analytics
Instant Images: version: 6.1.0, author: Darren Cooney
Limit Login Attempts Reloaded: version: 2.25.29, author: Limit Login Attempts Reloaded
LiteSpeed Cache: version: 6.0.0.1, author: LiteSpeed Technologies
Ocean Extra: version: 2.2.4, author: OceanWP
Ocean Social Sharing: version: 2.0.6, author: OceanWP
Ocean Stick Anything: version: 2.0.7, author: OceanWP
Rank Math SEO: version: 1.0.211, author: Rank Math
Simple Cloudflare Turnstile: version: 1.25.0, author: Elliot Sowersby, RelyWP
StarBox: version: 3.4.7, author: Squirrly UK
wpDiscuz: version: 7.6.14, author: gVectors Team
WPForms Lite: version: 1.8.6.3, author: WPForms
WP Mail SMTP: version: 3.11.1, author: WP Mail SMTP
WP Reading Progress: version: 1.5.6, author: Joeri van Veen wp-media

image_editor: WP_Image_Editor_Imagick
imagick_module_version: 1808
imagemagick_version: ImageMagick 7.1.0-62 Q16-HDRI x86_64 20885 https://imagemagick.org
imagick_version: 3.7.0
file_uploads: 1
post_max_size: 1024M
upload_max_filesize: 1024M
max_effective_size: 1 GB
max_file_uploads: 20
imagick_limits:
imagick::RESOURCETYPE_AREA: 2 TB
imagick::RESOURCETYPE_DISK: 9.2233720368548E+18
imagick::RESOURCETYPE_FILE: 196608
imagick::RESOURCETYPE_MAP: 1.006 GB
imagick::RESOURCETYPE_MEMORY: 503 GB
imagick::RESOURCETYPE_THREAD: 1
imagick::RESOURCETYPE_TIME: 9.2233720368548E+18
imagemagick_file_formats: 3FR, 3G2, 3GP, AAI, AI, APNG, ART, ARW, ASHLAR, AVI, AVIF, AVS, BAYER, BAYERA, BGR, BGRA, BGRO, BIE, BMP, BMP2, BMP3, BRF, CAL, CALS, CANVAS, CAPTION, CIN, CIP, CLIP, CMYK, CMYKA, CR2, CR3, CRW, CUBE, CUR, CUT, DATA, DCM, DCR, DCRAW, DCX, DDS, DFONT, DNG, DOT, DPX, DXT1, DXT5, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, ERF, EXR, FARBFELD, FAX, FF, FITS, FL32, FLV, FRACTAL, FTS, FTXT, G3, G4, GIF, GIF87, GRADIENT, GRAY, GRAYA, GROUP4, GV, HALD, HDR, HEIC, HEIF, HISTOGRAM, HRZ, HTM, HTML, ICB, ICO, ICON, IIQ, INFO, INLINE, IPL, ISOBRL, ISOBRL6, J2C, J2K, JBG, JBIG, JNG, JNX, JP2, JPC, JPE, JPEG, JPG, JPM, JPS, JPT, JSON, K25, KDC, KERNEL, LABEL, M2V, M4V, MAC, MAP, MASK, MAT, MATTE, MEF, MIFF, MKV, MNG, MONO, MOV, MP4, MPC, MPEG, MPG, MRW, MSL, MSVG, MTV, MVG, NEF, NRW, NULL, ORA, ORF, OTB, OTF, PAL, PALM, PAM, PANGO, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PDFA, PEF, PES, PFA, PFB, PFM, PGM, PGX, PHM, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG00, PNG24, PNG32, PNG48, PNG64, PNG8, PNM, POCKETMOD, PPM, PS, PS2, PS3, PSB, PSD, PTIF, PWP, QOI, RADIAL-GRADIENT, RAF, RAS, RAW, RGB, RGB565, RGBA, RGBO, RGF, RLA, RLE, RMF, RSVG, RW2, SCR, SCT, SFW, SGI, SHTML, SIX, SIXEL, SPARSE-COLOR, SR2, SRF, STEGANO, STRIMG, SUN, SVG, SVGZ, TEXT, TGA, THUMBNAIL, TIFF, TIFF64, TILE, TIM, TM2, TTC, TTF, TXT, UBRL, UBRL6, UIL, UYVY, VDA, VICAR, VID, VIFF, VIPS, VST, WBMP, WEBM, WEBP, WMF, WMV, WMZ, WPG, X, X3F, XBM, XC, XCF, XPM, XPS, XV, XWD, YAML, YCbCr, YCbCrA, YUV
gd_version: 2.3.3
gd_formats: GIF, JPEG, PNG, WebP, BMP, AVIF, XPM
ghostscript_version: 9.27 wp-server

server_architecture: Linux 4.18.0-477.27.2.lve.el8.x86_64 x86_64
httpd_software: LiteSpeed
php_version: 8.1.25 64bit
php_sapi: litespeed
max_input_variables: 5000
time_limit: 360
memory_limit: 1024M
max_input_time: 360
upload_max_filesize: 1024M
php_post_max_size: 1024M
curl_version: 7.87.0 OpenSSL/1.1.1w
suhosin: false
imagick_availability: true
pretty_permalinks: true
htaccess_extra_rules: true
current: 2024-01-23T17:42:38+00:00
utc-time: Tuesday, 23-Jan-24 17:42:38 UTC
server-time: 2024-01-23T18:42:36+01:00 wp-database

extension: mysqli
server_version: 10.6.16-MariaDB-cll-lve
client_version: mysqlnd 8.1.25
max_allowed_packet: 1073741824
max_connections: 2000 wp-constants

WP_HOME: undefined
WP_SITEURL: undefined
WP_CONTENT_DIR: /home/u438600120/domains/sakis.tech/public_html/wp-content
WP_PLUGIN_DIR: /home/u438600120/domains/sakis.tech/public_html/wp-content/plugins
WP_MEMORY_LIMIT: 40M
WP_MAX_MEMORY_LIMIT: 1024M
WP_DEBUG: false
WP_DEBUG_DISPLAY: true
WP_DEBUG_LOG: false
SCRIPT_DEBUG: false
WP_CACHE: true
CONCATENATE_SCRIPTS: undefined
COMPRESS_SCRIPTS: undefined
COMPRESS_CSS: undefined
WP_ENVIRONMENT_TYPE: Nicht definiert
WP_DEVELOPMENT_MODE: undefined
DB_CHARSET: utf8
DB_COLLATE: undefined wp-filesystem

wordpress: writable
wp-content: writable
uploads: writable
plugins: writable
themes: writable
mu-plugins: writable wp_mail_smtp

version: 3.11.1
license_key_type: lite
debug: Keine Debug-Hinweise gefunden.
lite_install_date: Aug 24, 2020 @ 6:44pm wpforms

version: 1.8.6.3
lite: 12.01.2020 um 01:55 Uhr
upload_dir: Beschreibbar
total_forms: 1
total_submissions: 4

Here is my style.css which is located under /wp-content/themes/oceanwp-child/:

/*
Theme Name: OceanWP Child
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme example child theme.
Author: Nick
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Borlabs Cookie Box Shadow */
#BorlabsCookieBox ._brlbs-box {
  background: #fff;
  color: #555;
  font-size: 14px;
  border: 3px solid rgba(0, 0, 0, 0.37)!important;
  border-radius: 10px !important;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.62), 0px 7px 13px -3px rgba(0, 0, 0, 0.51), inset 0 -3px 0px rgba(0, 0, 0, 0.37) !important;
}

/* Titles margin bottom on the banner of the home page */
.elementor-element.banner-margin { margin-bottom: 10px; }

/* Footer Callout */
.lingerie-callout .col { border-left: 1px solid #555; }
.lingerie-callout .col-1 { border-left: 0; }
.lingerie-callout .callout-content { line-height: 1; text-align: center; }
.lingerie-callout .callout-content a { display: inline-block; }
.lingerie-callout .icon-box-icon, .lingerie-callout .icon-box-heading { display: inline-block; vertical-align: middle; }
.lingerie-callout .icon-box-icon { margin-right: 12px; }
.lingerie-callout .icon-box-icon span { font-size: 22px; }
.lingerie-callout .icon-box-heading { font-size: 16px; font-weight: 400; margin: 0; letter-spacing: 1px; text-transform: capitalize; }

@media screen and (max-width: 767px) {
    .lingerie-callout .col { border-left: 0 !important; }
    .lingerie-callout .icon-box-icon { display: none; }
    .lingerie-callout .icon-box-heading { display: block; }
}

/* Footer */
#footer-widgets .footer-box { width: 25%; border-left: 1px solid #373737; padding-left: 60px; }
#footer-widgets .footer-box.col-1 { width: 50%; border-left: 0; padding-left: 0 !important; }
#footer-widgets .footer-box .footer-widget.social-widget { margin-bottom: 14px; }
#footer-widgets .footer-box .widget-title { border: 0; padding-left: 0; }
#footer-widgets .footer-box .social-widget .style-simple li a { font-size: 14px; width: 26px; }
#footer-widgets .oceanwp-newsletter-form-wrap input[type="email"] { background-color: #383838; color: #909090; border-color: #383838; font-size: 13px; padding: 6px 12px; height: 40px; border-radius: 20px; }
#footer-widgets .oceanwp-newsletter-form-wrap input[type="email"]:focus { border-color: #525252; }
#footer-widgets .oceanwp-newsletter-form-wrap button { background-color: #212121; height: 36px; right: 2px; padding: 0 24px; border-radius: 20px; }
#footer-widgets .oceanwp-newsletter-form-wrap button:hover { background-color: #ff4a96; }

/* Footer Bottom */
#footer-bottom { padding: 0; }
#footer-bottom-inner { border-top: 1px solid #373737; padding: 20px 0; }
#footer-bottom #copyright, #footer-bottom #footer-bottom-menu { float: none; width: 100%; text-align: center; padding: 0; }
#footer-bottom #footer-bottom-menu { margin-bottom: 16px; }
#footer-bottom a, #footer-bottom #footer-bottom-menu a { font-size: 13px; padding: 0 10px; }

/* Responsive */
@media screen and (max-width: 1280px) {
    #footer-widgets .footer-box { padding-left: 20px; }
}
@media screen and (max-width: 959px) {
    #footer-widgets .footer-box { padding-left: 10px; }
}
@media screen and (max-width: 767px) {
    #footer-widgets .footer-box { border-left: 0; padding-left: 0; padding-top: 20px; }
}
@media screen and (max-width: 480px) {
    #scroll-top { display: none !important; }
}
@media screen and (max-width: 320px) {
    #site-logo #site-logo-inner a img { max-width: 150px; }
}

/* hebt den Standard Code befehl etwas hervor */
code {
    color: #fbfbfb;
    background-image: linear-gradient(to top, #f77062 0%, #fe5196 100%);
    border-radius: 3px;
    padding: 2px 4px 2px 4px;}

/* Markierungsfarbe f?r den Standard Code */
code::selection {
 color: #51898c;
 background: #d1e6e2;
}

/* Markierungsfarbe f?r highlighting-code-block */
.hcb_wrap ::selection {
 background: #1DB99A;
 color: white;
}

/*  deaktiviert Border bei Klick*/
a:active, a:focus {
  outline: 0!important;
  border: none!important;
  -moz-outline-style: none!important;
}

/* Text markieren, sch?nes Gr?n */
::selection{  
    background-color: #7bdcb5;  
}  

/* Schatten Sidebar */
.clr > .sidebar-box {
	box-shadow: 0 6px 18px rgba(0,0,0,.1);
	background: #f7f7f7;
	border: 1px solid #e8e8e8;
}

/* Schatten f?r Seitentitel Schrift */
.page-header-title {
	font-family: Roboto;
	font-weight: 300;
	text-shadow: 2px 2px 5px rgb(0, 0, 0);
}


/* abstand seidebar wenn man unten scrollt*/
.widget-area .sidebar-box {
    background-color: #fff;
    padding: 30px;
    margin-bottom: 20px!important;
}

/* #### Kommentar box unten  #### */

/* Namenfarbe */
#wpdcom .wpd-blog-guest .wpd-comment-author, #wpdcom .wpd-blog-guest .wpd-comment-author a {
    color: white;
}

/* Gradient */
#wpdcom.wpd-layout-3 .wpd-comment .wpd-comment-header {
    background-color: #f7f7f7;
    margin-left: -1px;
    background-image: linear-gradient( 109.8deg, rgba(250,111,152,1) 5.6%, rgba(255,189,55,1) 91.5% );
    padding: 10px 0 7px;
}

/* links bei autor border*/
#wpdcom.wpd-layout-3 .wpd-reply .wpd-blog-post_author {
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-image: linear-gradient(to right, #fa6f98, #ffbd37) 1;
}

/*?ber autor info kein border*/
.wpd-blog-guest .wpd-comment-subheader {
    border-top: none!important;
}

#wpdcom.wpd-layout-3 .wpd-reply .wpd-blog-post_author .wpd-comment-right {
    border-left: none!important;
}

#wpdcom.wpd-layout-3 .wpd-reply .wpd-blog-post_author .wpd-comment-right {
    border-left: none;
}

.wpd-comment-wrap.wpd-blog-guest {
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-image: linear-gradient(to right, #fa6f98, #ffbd37) 1;
}

#wpdcom .wpd-blog-guest .wpd-comment-author {
	color: white!important;
}

#wpdcom .wpd-blog-post_author .wpd-comment-author, #wpdcom .wpd-blog-post_author .wpd-comment-author a {
    color: white!important;
}

#wpdcom .wpd-blog-guest .wpd-comment-label {
    color: #ffffff;
	background-image: linear-gradient(45deg, #874da2 0%, #c43a30 100%);
    border: none;
}

#wpdcom.wpd-layout-3 .wpd-comment .wpd-comment-right {
    padding-bottom: 0px;
    border-left: none!important;
    border-bottom: none!important;
    width: calc(100% - 35px);
}

#wpdcom.wpd-layout-3 .wpd-comment .wpd-comment-footer .wpd-wpanel {
    width: 20px;
    height: 20px;
    background-color: white;
}

#wpdcom.wpd-layout-3 .wpd-comment .wpd-comment-footer .wpd-vote {
    padding-left: 18px;
    margin-left: -20px;
    background-color: white;
}

#wpdcom .wpd-comment-header .wpd-comment-link {
    padding: 0;
    cursor: pointer;
    font-size: 12px;
    color: white;
    align-self: flex-start;
    padding-top: 9px;
}

/*Ambiente licht unter logo f?r Blogbeitrag*/
#site-header{
  text-align: center;
  border-bottom: 5px solid #f55951;
  box-shadow: 0px 0px 50px 10px #f55951;
}

/*Polaroid-Effekt f?r Thumbnail-Blog Bilder
span.overlay {
  border: solid #fff;
    border-top-width: medium;
    border-right-width: medium;
    border-bottom-width: medium;
    border-left-width: medium;
  border-width: 6px 6px 6px 6px;
  -webkit-box-shadow: 1px 1px 5px #333;
}*/

/*Schatten und farbe unter reader laufband*/
#ruigehond006_inner {
  position: absolute;
  height: 0;
  width: inherit;
  -webkit-transition: height .4s;
  transition: height .4s;
  background-color: #572f2f;
  box-shadow: 0px 0px 10px 2px #000;
}

/*Schatten und farbe unter Titelbild*/
.background-image-page-header-overlay {
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
  box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 60px 40px -7px;
  box-shadow: rgba(240, 46, 170, 0.4) 0px 5px, rgba(240, 46, 170, 0.3) 0px 10px, rgba(240, 46, 170, 0.2) 0px 15px, rgba(240, 46, 170, 0.1) 0px 20px, rgba(240, 46, 170, 0.05) 0px 25px;
  box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
  box-shadow: #262626 0px 5px 30px 5px;
  border-bottom: 2px solid white;
}

/*Border f?r Dropdownmenu*/
.sf-menu ul.sub-menu {
  position: absolute;
  visibility: hidden;
  top: 100%;
  left: 0;
  z-index: 9999;
  border-right: 5px solid #f55951;
  border-bottom: 5px solid #f55951;
  border-left: 5px solid #f55951;
}

/* unterst?tze mich Titel zentriert*/
.wp-block-heading.has-text-align-center {
  text-align: center;
}

/*QR-Code Spende verkleinert
.wp-image-2383.ls-is-cached.lazyloaded {
  width: 60%;
}*/

/*Wie gef?llt dir mittig - ANFANG*/
#wpd-post-rating .wpd-rating-wrap .wpd-rating-title {
  width: 175px;
  white-space: break-spaces;
  word-break: break-all;
  font-size: 12px;
  letter-spacing: .5px;
  color: #888;
  line-height: 16px;
  display: block;
  margin-top: 7px;
  margin-bottom: -3px;
}

#wpd-post-rating .wpd-rating-wrap .wpd-rating-data {
  width: 175px;
  white-space: nowrap;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}

#wpd-post-rating .wpd-rating-wrap .wpd-rating-left {
  flex-grow: 1;
  height: 1px;
  border-bottom: 1px dashed #999;
  margin-right: -50px;
}

#wpd-post-rating .wpd-rating-wrap .wpd-rating-right {
  flex-grow: 1;
  height: 1px;
  border-bottom: 1px dashed #999;
  margin-left: -50px;
}

/*Wie gef?llt dir mittig - ENDE*/

/* Kommentar Bubble Links abstand unten weg - START*/
#wpd-bubble-wrapper > div {
  display: none;
  border: 1px solid #fff;
  box-shadow: 0px 0px 15px #aaa;
  margin-bottom: 0px!important;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  color: #fff;
  align-items: center;
  justify-content: center;
  position: relative;
/* Kommentar Bubble Links abstand unten weg - ENDE*/

/* --- Blogtitel bounce und gradient underline ---- */

@keyframes bounce {
	0% {
		opacity: 0;
		transform: translateX(-50px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
.blog-entry-title.entry-title {  
  animation: bounce 1s linear 0s 1 normal none;
}
.blog-entry-title.entry-title:hover {
  cursor: pointer;
  animation-name: bounce;
  -moz-animation-name: bounce;
}

.blog-entry-title.entry-title a {
  transition: all 0.5s linear;
  text-decoration: none;
  padding-bottom: 5px;
  background: hsla(14, 90%, 73%, 1);
  background: linear-gradient(90deg, hsla(14, 90%, 73%, 1) 0%, hsla(331, 54%, 44%, 1) 100%);
  background: -moz-linear-gradient(90deg, hsla(14, 90%, 73%, 1) 0%, hsla(331, 54%, 44%, 1) 100%);
  background: -webkit-linear-gradient(90deg, hsla(14, 90%, 73%, 1) 0%, hsla(331, 54%, 44%, 1) 100%);
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#F8997D", endColorstr="#AD336D", GradientType=1 );  background-size: 0px 2px;
  background-repeat: no-repeat;
  background-position: left 85%;
  text-shadow: 0;

  &:hover {
    background-size: 100% 2px;
    text-shadow: 1px 1px 1px #5e1f1c;
  }
}
        

/* --- Blogtitel bounce und gradient underline - ENDE ---- */


/* --- Blogbild effekt */
.attachment-full.size-full.wp-post-image {
  --m: radial-gradient(circle farthest-side at right, #000 99%, #0000) 0 100% / 46% 92% no-repeat,
       radial-gradient(circle farthest-side at left, #000 99%, #0000) 100% 0 / 46% 92% no-repeat;
  -webkit-mask: var(--m);
  mask: var(--m);
  filter: blur(5px);;
  transition: 0.3s linear;
  cursor: pointer;
}

.attachment-full.size-full.wp-post-image:hover {
  -webkit-mask-position: 7.5% 50%, 92.5% 50%;
  mask-position: 7.5% 50%, 92.5% 50%;
  filter: blur(0);;
}
/* --- Blogbild effekt - ENDE */


/* --- QR-Code Spende verkleinert  */
.wp-image-2719.lazyloaded {
  --c: #f55951; /* the border color */
  --b: 10px;    /* the border thickness*/
  --g: 5px;     /* the gap on hover */
  
  padding: calc(var(--g) + var(--b));
  --_g: #0000 25%,var(--c) 0;
  background: 
    conic-gradient(from 180deg at top    var(--b) right var(--b),var(--_g))
     var(--_i,200%) 0  /200% var(--_i,var(--b))  no-repeat,
    conic-gradient(            at bottom var(--b) left  var(--b),var(--_g))
     0   var(--_i,200%)/var(--_i,var(--b)) 200%  no-repeat;
  transition: .3s, background-position .3s .3s;
  cursor: pointer;
}
.wp-image-2719.lazyloaded:hover {
  --_i: 100%;
  transition: .3s, background-size .3s .3s;
}
/* --- Copy Button bei Code */

button.hcb-clipboard {
background-color: #fff !important;
  background-image: url(url(https://sakis.tech/wp-content/plugins/highlighting-code-block/build/css/../../assets/img/copied.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 20px auto !important;
  border: 0;
  border-radius: 10px !important;
  box-sizing: border-box;
  height: 30px !important;
  padding: 18px !important;
  position: absolute;
  right: 0;
  text-align: center;
  top: 7px !important;
  width: 20px !important;
  z-index: 1;
  margin: 15px !important;
}
/* --- Copy Button bei Code - ENDE */

/* --- Code border-radius - BEGIN */
.hcb_wrap.hcb_wrap code, .hcb_wrap.hcb_wrap pre {
  border-radius: 10px!important;
  background: #283342!important;
}

.prism.undefined-numbers.language-bash {
  box-shadow: 3px 3px 0px 1px #51647d !important;
  border: 1px solid #fff !important;
}
/* --- Code border-radius - ENDE */

/* Fade para Lazy Load de Litespeed - PART 1 - Before Lazy Load */
img[data-lazyloaded]{
	opacity: 0;
}

/* PART 2 - Upon Lazy Load */
img.litespeed-loaded{
	-webkit-transition: opacity .5s linear 0.2s;
	-moz-transition: opacity .5s linear 0.2s;
	transition: opacity .5s linear 0.2s;
	opacity: 1;
}

Can you do something with it or help me?

Thank you.

Greetings
sakis

Shahin

(@skalanter)

2 years, 4 months ago

Hello @sakis2019,

In this case, the content of the CSS is not very important, and the important thing is that you can load the CSS in the place you want. Such an issue may be due to your customization, so it is not reproducible for us.

To solve it, as I mentioned earlier, you must change the load stylesheet on the child theme, so please try to use the load CSS like this code(try to create a new CSS file and load as explained in the following link): https://developer.ww.wp.xz.cn/themes/basics/including-css-javascript/.

There are some examples in that article, and you can find the standard way in this link and learn to troubleshoot your code.

Or you can try this plugin:
https://ww.wp.xz.cn/plugins/custom-css-js/ It’s a light plugin that can help you load CSS and JS files in frontend and admin.

I noticed some errors in the CSS you provided. Please check before uploading it to your website to ensure it works properly. Click here to check: https://jigsaw.w3.org/css-validator/

If you are unfamiliar with PHP/CSS, you can contact a PHP/WordPress Developer/CSS expert who can help you solve it.

Best Regards

Thread Starter

sakis2019

(@sakis2019)

2 years, 4 months ago

Thanks for the tip, the first one helped. Now everything is working as desired again.

greetings
sakis

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Custom CSS Not Recognized After Theme Update’ is closed to new replies.