Home>Support>Ajax page loading breaks Widget Icons

Ajax page loading breaks Widget Icons

Hi,

Fantastic plugin….just what I needed but I’ve hit a problem in the SO Widgets Bundle.

I am using ajax page loading to avoid hard refreshes and have managed to reload the SO Panels CSS similarly to this post – https://github.com/siteorigin/siteorigin-panels/issues/87 – so I am all good to this point. :-)

However after my page refresh, the icons do not load in Features or the Social Widget on my front-page. The circle backgrounds do load just not the icons?

The problem only exists if you enter the site on a page with no icons/panels active and then navigate to a page with icons/panels on. I assume this is because the icons stylesheets have not been loaded on the originally loaded page? Even my special stylesheet reloading code doesn’t seem to catch the icons stylesheets either so I am suspecting that this one is a bit deeper than my knowledge.

I am a self taught coder/code hack and have been working on this site for about 18 months. This is one of the last pieces of the puzzle and I just wondered if anyone knew a way round this? My site/theme is quite custom but I don’t think anything is conflicting and after a good look (3hrs) at the SO Widgets Bundle code I just couldn’t spot anything that may need reloading or a way to get this sorted.

I would really appreciate any help you can offer.

Sarah Richardson

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 6 months ago Alex S
    Hi, I Work Here

    Hi Sarah,

    Yeah this is due to the reason you suspect. It’s not pulling in the correct stylesheet. I would recommend using wp_enqueue_style to add the font libraries you use on all pages, or to do it on the fly if you know the page has an icon. For reference, the stylesheets can be found in so-widgets-bundle/icons/

  2. 8 years, 6 months ago Sarah Richardson

    Hi Alex

    Enqueuing the fontawesome library from SO Widgets Bundle works fine and I will work on a function to do it on the fly, so thanks for that. However, I don’t seem to be able to retrieve the background css (i.e the circle) for the social media icons. Where should I be looking or is it generated on the fly and I have hit another problem?

    Many thanks for your help so far

    Sarah

  3. 8 years, 6 months ago Alex S
    Hi, I Work Here

    Hi Sarah,

    The CSS for the circle icon widget should be in the default Vantage stylesheet. Could you double check to see if you’re including the parent stylesheet correctly?

  4. 8 years, 6 months ago Sarah Richardson

    Hi Alex,

    I believe that you are referring to Vantage Theme which I am not using. My theme is a child theme of another theme. Should I copy the stylesheet from Vantage and enqueue it in my child theme or is there another way to deal with this?

    Sarah

  5. 8 years, 6 months ago Alex S
    Hi, I Work Here

    Hi Sarah,

    Sorry, you’re right! It’s awkward because I made sure to check your theme before responding initially. :/

    Okay, so I’m not following exactly. Could you show me an example of what you mean? Maybe even a public URL where I can take a look at what’s going on? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

  6. 8 years, 6 months ago Private Message - Sarah Richardson

    This is a private message.

  7. 8 years, 6 months ago Private Message - Alex S Hi, I Work Here

    This is a private message.

  8. 8 years, 6 months ago Alex S
    Hi, I Work Here

    Hi Sarah,

    Sorry for the delay – I’ve been flat out lately. :(

    I’ve logged in and spotted the issue. Okay, so the social media icons have a stylesheet generated (basically complied) for them. I would recommend referring to the docs for this one.

  9. 8 years, 3 months ago Sarah Richardson

    Hi Alex

    I know it's been forever since your reply (Your e-mail got lost in my sea of gmail!) but I have just noticed I haven't resolved this on my dev and remembered my post on this forum.

    I have had a look at the suggested link but I cannot see how I would approach this so that the .less files are recompiled when my page refreshes with ajax. Could you maybe give me a hint? I am unfamiliar with .less.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More