Skip to content

Widget | CSS customization

Solved WordPress
53 2 18.9k 1
  • wrote on last edited by
    #38

    @Sala Those are just placeholders and inherited from the iframe embed. If you change those values, nothing will happen.

  • @Sala Those are just placeholders and inherited from the iframe embed. If you change those values, nothing will happen.

    wrote on last edited by
    #39

    @phenomlab you know the current yt video size is 400 * 225, on that line at the end of that code and still its reported to be very tall. So these placeholders could be the culprit

  • @phenomlab you know the current yt video size is 400 * 225, on that line at the end of that code and still its reported to be very tall. So these placeholders could be the culprit

    wrote on last edited by
    #40

    @Sala What do you get if you try in incognito? It works fine for me.

  • @Sala What do you get if you try in incognito? It works fine for me.

    wrote on last edited by
    #41

    @phenomlab we are called off for supper, will attempt to check using that, the browser would have to start a fresh. Catch up on later. Many thanks bdw

  • @Sala What do you get if you try in incognito? It works fine for me.

    wrote on last edited by
    #42

    @phenomlab i also believe the video is okay, though the report is still unclear.

    Is this a video issue or its the article image?
    alt text

  • @phenomlab i also believe the video is okay, though the report is still unclear.

    Is this a video issue or its the article image?
    alt text

    wrote on last edited by
    #43

    @Sala That’s telling you that the video is too tall, and doesn’t meet Google’s criteria. You should remove the CSS below and be more specific with image sizes

    div.text img {
        width: 100%;
        height: 315px;
    }
    

    You are targeting all img tags with this CSS, which is less than desirable. Let’s first remove this CSS and see if that resolves the Google crawl issue which I’m confident it will.

  • @Sala That’s telling you that the video is too tall, and doesn’t meet Google’s criteria. You should remove the CSS below and be more specific with image sizes

    div.text img {
        width: 100%;
        height: 315px;
    }
    

    You are targeting all img tags with this CSS, which is less than desirable. Let’s first remove this CSS and see if that resolves the Google crawl issue which I’m confident it will.

    wrote on last edited by
    #44

    @phenomlab sure, let me compose myself, because the css currently is wrapped up. But, what of the height if we remove its going to use the image height which sometime back i saw them occupying a large space.

    div.text is affecting even yt video d**n, that brings up the picture 👍

  • @phenomlab sure, let me compose myself, because the css currently is wrapped up. But, what of the height if we remove its going to use the image height which sometime back i saw them occupying a large space.

    div.text is affecting even yt video d**n, that brings up the picture 👍

    wrote on last edited by
    #45

    @Sala it will affect that because you are targeting all img elements - this is why I said to remove that CSS block

  • @Sala it will affect that because you are targeting all img elements - this is why I said to remove that CSS block

    wrote on last edited by
    #46

    @phenomlab On it sir

  • @Sala it will affect that because you are targeting all img elements - this is why I said to remove that CSS block

    wrote on last edited by
    #47

    @phenomlab done, its resubmitted on google. I am composing another article so we can clarify if that was the problem. Talk to you later

  • @phenomlab done, its resubmitted on google. I am composing another article so we can clarify if that was the problem. Talk to you later

    wrote on last edited by
    #48

    @Sala Ok. Keep me posted.

  • @Sala Ok. Keep me posted.

    wrote on last edited by
    #49

    @phenomlab new article has been index though we have the same issue. At least not from article image, this time its the image from the video?
    alt text

  • @phenomlab new article has been index though we have the same issue. At least not from article image, this time its the image from the video?
    alt text

    wrote on last edited by
    #50
  • wrote on last edited by Sala
    #51

    @phenomlab Hi, thanks for the additional info, it would help people online by comparing. For us we finally found a solution fixing the videos totally in a different way. It was detailed with one of our member. It appears that google has made some changes over these recent days. We’re formulating a plan on how we would save old and future articles. It has been a joy though hell of a ride.

  • wrote on last edited by
    #52

    @phenomlab Hi, please help us to hide the cap links from crawlers. P - pakistan which is on homepage.

    alt text

  • @phenomlab Hi, please help us to hide the cap links from crawlers. P - pakistan which is on homepage.

    alt text

    wrote on last edited by
    #53

    @Sala the only way you can achieve this is to use a robots.txt file and disallow access to those links.


Did this solution help you?
Did you find the suggested solution useful? Support 💗 Sudonix with a coffee ☕
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • Fixing YouTube videos css

    Solved WordPress css
    8
    2 Votes
    8 Posts
    3k Views
    Sala
    @phenomlab It looks good, but not anymore. I’ve already lost so much time. Now it’s time to move on
  • hover link effect

    Solved Customisation css link hover
    18
    1
    6 Votes
    18 Posts
    7k Views
    phenomlab
    @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.
  • answers appearance css code request

    Solved Customisation css answers
    11
    1
    1 Votes
    11 Posts
    4k Views
    phenomlab
    @DownPW yes, because of the modifications that Sudonix uses, you’ll need to tailor to fit your needs.
  • CSS3: Gradient Generator

    Development css gradient
    1
    1 Votes
    1 Posts
    896 Views
    No one has replied
  • tag icon in front of tags

    Solved Customisation css
    5
    3 Votes
    5 Posts
    2k Views
    crazycells
    @phenomlab said in tag icon in front of tags: @crazycells Are you using Font Awesome Free ? If so, try this span.tag:before { content: "\f02b"; font-family: "Font Awesome 5 Free"; margin-right: 5px; margin-left: 5px; font-weight: 900; } yeap, this worked thanks a lot.
  • [NODEBB] Reply Button/arrow answer

    Solved Customisation css nodebb
    25
    4
    4 Votes
    25 Posts
    12k Views
    DownPW
    Topic open https://sudonix.com/topic/207/nodebb-help-for-my-custom-css
  • [NODEBB] Scroll Button

    Solved Customisation css javascript html scroll button
    7
    1
    0 Votes
    7 Posts
    3k Views
    phenomlab
    @downpw ooops. Forgot that. Thanks for adding.
  • Bug Navbar CSS

    Solved Customisation navbar css
    3
    1 Votes
    3 Posts
    2k Views
    DownPW
    Not better way. Thanks.