#136308 Jupiter-x CSS incorrect url format for font-family

Landing Forums JupiterX WordPress Theme Jupiter-x CSS incorrect url format for font-family

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • Stephane Audoynaud

    hello,

    the generated css by jupiter-X enclose some wrong information.

    In our case we are running WP on a docker AWS/Fargate and we use Cloudfront Full Site Delivery.
    The dockerized WP is behind a target group and an Application Load Balancer.
    The URL of our staging website on FSD is : https://web.port-adhoc.com

    the webpage itself contains un link to the css file

    <link <span class=”html-attribute-name”>rel</span>='<span class=”html-attribute-value”>stylesheet</span>’ <span class=”html-attribute-name”>id</span>='<span class=”html-attribute-value”>jupiterx-css</span>’ <span class=”html-attribute-name”>href</span>=’https://web.port-adhoc.com/wp-content/uploads/jupiterx/compiler/jupiterx/63ca595.css?ver=1.26.0‘ <span class=”html-attribute-name”>type</span>='<span class=”html-attribute-value”>text/css</span>’ <span class=”html-attribute-name”>media</span>='<span class=”html-attribute-value”>all</span>’ />

    We found the the CSS file generated by JupiterX contain the following issue:

    {  font-family: "jupiterx";  src: url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.eot");  src: url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.eot?#iefix") format('eot'), url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.woff2") format('woff2'),
    url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.woff") format('woff'), url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.ttf") format('truetype'), url("https://54.77.39.42/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.svg#jupiterx") format('svg');}

    you see that the CSS encloses the IP address of the docker, which is no way correct, it should writes instead, either

    • a relative path (best)

    src: url(“../../../wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.eot”)

    • or the final Cloudfront url

      web.port-adhoc.com/wp-content/themes/jupiterx/lib/assets/fonts/jupiterx.eot

    I can always edit the CSS fil manually of course, but each time we will generate again the Assets from JupiterX (/wp-admin/admin.php?page=jupiterx#/settings) the issue will pop-up again

    thanks for your help

    Stéphane

    Mohsin Al-Rabieai Support Team

    Hi Stephane,

    Sorry for the delayed response. In order to troubleshoot this issue please do the followings:

    – Make sure the website URL and homepage URL is correctly provided on WordPress Settings -> General and they are “Domain” instead of IP address.

    – Install and activate the “Better search and replace” plugin, then run a replace on all the database tables and GUIDs and replace the above IP with your domain.

    – Use Elementor -> Tools -> Replace URL to replace the above IP with your domain.

    – Make sure the site address is not provided with the IP address in your wp-config.php file.

    After doing the above steps, please save your permalinks once through WordPress settings -> Permalinks and then regenerate the assets through Jupiter X -> Control Panel -> Settings once. It should resolve the issue.

    Best regards

    Stephane Audoynaud

    Dear Mohsin
    thanks for you reply.

    I have found what actually occurs:
    regenerate the assets through Jupiter X -> Control Panel -> Settings will erase the
    /wp-content/uploads/jupiterx/compiler/jupiterx/63ca595.css file

    but it will not recreate the new one (I found that by looking via FTP)

    the new css file is generated when a first page is loaded.
    In my case I am using in wp-config.php the following setting:
    define(‘WP_SITEURL’,’https://&#8217; . $_SERVER[‘HTTP_HOST’] . ‘/’);
    define(‘WP_HOME’,’https://&#8217; . $_SERVER[‘HTTP_HOST’] . ‘/’);

    I’m doing this because the domain name and certificate are handled at the Application Load Balancer level and for other technical reasons.

    So in my case, some bots where scanning the site through its IP address just after I made an asset flush, so Jupiter-x recreated the css with the url that has been used to browse the page… I have now blocked access direct access to the docker, plus added some firewall at the ALB level, regenerated the asset and right after that I went to browse on a web page, and the new css contains now the url instead of the IP address.

    this points out that:

    regenerate the assets via jupitex Jupiter X -> Control Panel -> Settings will only flush the assets
    assets are generated at first next browsing of page

    is this an intended behaviour ?
    I would say that I would expect from the regenerate the assets button both flushing and reconstructing them .

    other thing I would like to point out:
    I am using this server as an origin for the AWS Cloudfront Full Site Delivery. It happens that Cloudfront is not rewriting the url contained in the css… so containing inside the css this absolute urls will make browser still to point to my origin instead of Cloudfront.

    The better would be that Jupiter-x uses relatives url like

    {
    font-family: “jupiterx”;
    src: url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.eot”);
    src: url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.eot?#iefix”) format(‘eot’),
    url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.woff2”) format(‘woff2’),
    url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.woff”) format(‘woff’),
    url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.ttf”) format(‘truetype’),
    url(“../../../../themes/jupiterx/lib/assets/fonts/jupiterx.svg#jupiterx”) format(‘svg’);
    }

    Elementor does that :

    see: https://web.port-adhoc.com/wp-content/plugins/elementor/assets/lib/font-awesome/css/regular.min.css?ver=5.15.3

    thanks

    Mohsin Al-Rabieai Support Team

    Hi Stephane,

    Thanks for your detailed report. I have raised an improvement request in our backlog so our developers check this. As far as I know, we use a PHP library to compile LESS resources into one CSS file and that is part of the theme.

    Best regards

Viewing 4 posts - 1 through 4 (of 4 total)
You must be logged in to reply to this topic.
Login