Skip to content

Rotating Star Effect

Solved Let's Build It

Did this solution help you?
Did you find the suggested solution useful? Why not buy me a coffee? It's a nice gesture, and a great way to show your appreciation 💗

Related Topics
  • How to deploy WordPress.org Developer theme

    Solved Configure
    4
    1 Votes
    4 Posts
    413 Views

    @Hari the real issue here is that I don’t think it can be used as a theme for WordPress because of the dependencies it clearly has, including its own Web server.

    My view here is that this is designed to be a complete development environment outside of the WordPress core.

  • WP / Woocommerce Mystery

    Solved Configure
    23
    12 Votes
    23 Posts
    1k Views

    @Panda said in WP / Woocommerce Mystery:

    Just back to my other question, have you ever used Shopify?
    It insists on a templating language to use any custom js.

    Not personally as never had any need, however, I do know that it uses Liquid for JS templating. It’s written in Ruby and is used to generate dynamic content on shop fronts. There’s zero reason as to why it wouldn’t work with data supplied by 3rd party API’s, although WordPress code won’t natively work for obvious reasons, and as such, this code would need to be re-written.

    The JS part will likely work with minor modification, but not the PHP file in it’s current form.

  • 2 Votes
    11 Posts
    587 Views

    Thanks for your inputs ♥️

  • hover link effect

    Solved Customisation
    18
    6 Votes
    18 Posts
    1k Views

    @DownPW Looking at the underlying code, class start is being added on hover by jQuery in this function

    document.querySelectorAll(".button-gradient, .button-transparent").forEach((button) => { const style = getComputedStyle(button); const lines = document.createElement("div"); lines.classList.add("lines"); const groupTop = document.createElement("div"); const groupBottom = document.createElement("div"); const svg = createSVG( button.offsetWidth, button.offsetHeight, parseInt(style.borderRadius, 10) ); groupTop.appendChild(svg); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); lines.appendChild(groupTop); lines.appendChild(groupBottom); button.appendChild(lines); button.addEventListener("pointerenter", () => { button.classList.add("start"); }); svg.addEventListener("animationend", () => { button.classList.remove("start"); }); }); })

    The CSS for start is below

    .button-gradient.start .lines svg, .button-transparent.start .lines svg { animation: stroke 0.3s linear; }

    And this is the corresponding keyframe

    @keyframes stroke { 30%, 55% { opacity: 1; } 100% { stroke-dashoffset: 5; opacity: 0; } }

    It’s using both CSS and SVG, so might not be a simple affair to replicate without the SVG files.

  • 9 Votes
    32 Posts
    3k Views

    @DownPW said in Bottom footer navbar button extend:

    Oh my god, it’s beautiful mark

    I liked this design so much, I’ve implemented it here. I intend to do a lot more with the footer in due course, so hiding it makes a lot of sense. Thanks @DownPW for the idea and initial concept ♥

  • [NodeBB] greeting message

    Solved Customisation
    2
    3 Votes
    2 Posts
    641 Views

    @pwsincd welcome to sudonix, and thanks for the comments. What your looking for is here

    https://sudonix.com/topic/195/nodebb-welcome-message/3?_=1648295651358

  • [NodeBB] Import custom Font

    Solved Customisation
    12
    3 Votes
    12 Posts
    1k Views

    @cagatay you’ll need to define this in the body tag (or another element if you want greater or more granular targets) - for example

    body { font-family: "Poppins"; font-size: 16px; }

    Essentially, you use the font-size CSS directive.

  • 1 Votes
    2 Posts
    328 Views

    @hari the cache level for woocommerce should always be bypass. Any caching of woocommerce will cause you serious issues and will result in the checkout process not functioning correctly.

    This does mean that the overall experience will be slower (depending on geographic location) although CF is known to cause significant issues hence the need to bypass.

    If you want to cache as much as possible, then set rules to bypass caching on the cart and account pages etc.