Since a few weeks, the favicon of my webzine is no longer displayed, and this on the browser of my work, but also on my personal PC.
I do not think I have changed the configuration. I tried to re-upload it, to no avail.
https://www.yubigeek.com/
In the Google Chrome Developer Console, there is an error on favicon.ico (404) but in the source code of the page, this URL is not called.
There are however two tag link with a rel = "icon" and the URL of the favicon, if I click on the links, the images are there.
This is due to a div markup which wrongly appears if the head section of your pages. Such markup should only be in the body.
More details
Most browsers accept body-only markups in head. But Chrome has a particular behavior. When this happens, Chrome considers the head section to be closed. Therefore, following head markups are actually considered to be in the body. And since favicon markups do not work when there are in body...
This is why your favicon fails on Chrome but works on Firefox.
How to fix
Your first two div are around line 153, still in the head. As a hint, their ids are fb-root and fb-customerchat. That should help you spot which plugin is doing this.
Should you disable this plugin, at least for now? Your choice.
You should also report this issue to the plugin developer. You must not be the only one impacted by this issue.
The best way to add WordPress Favicon is adding favicon via Appearance > Customize > Site Identity. Create favicon image at least by 512 x 512 and follow the path to navigate. Then upload the image in Site Identity section. Save it and you're done.
Please follow this for more info.
It seems you're using a PNG image, you can try to add attribute type.
So your link would be something like : <link rel="icon" href="yourpath" type="image/png">
EDIT : Plus, put your .ico file in the root of you website if it's not already done.
This approach might help if you cannot fix invalid head markup explained by #philippe_b:
remove_action( 'wp_head', 'wp_site_icon', 99 );
add_action( 'wp_head', 'wp_site_icon', 0 );
Add it to functions.php in your child theme. This way we print site icons on top of head.
Related
I have a very strange external links behavior on this page:
https://dev.switchonpaper.site/en/daniel-g-andujar-the-artist-as-a-thinker-and-augur-of-what-happens/
There is a list of external links visible by clicking on "Go Deeper".
On some links, the address of the current page is added at the beginning of the external link.
E.g.: iSAM™ (1997)
E.g.: TTTP Photo Collection - 1997
All external links are absolute links.
When you look at the source code, the links are correct.
This site runs under Wordpress, the links are contained in a Gutenberg block built with the ACF plugin.
I tested the following things:
Disable all plugins.
The browser or something else continues to add the current page address on some links only.
I emptied the server cache, removed all the .htaccess rules except the wordpress part.
I made sure that the PHP file that writes these links is in UTF-8.
By recreating the links, it is always the same ones who are affected.
Does anyone have any idea what could cause this?
Thank you for your time and help!
You have the so called "hidden characters" before your link start. I suggest you to check it by yourself with some online tool like this: https://www.soscisurvey.de/tools/view-chars.php. If you try to paste there the link copied by your source code you will see you have hidden stuff before "https:..."
The solution to this issue is that you delete all the characters and you write them all over again by yourself, w/o copy/pasting them from another source or in alternative paste them inside some non-HTML text editor before pasting them to your website
im using wordpress and want to add a link which open in a frame/lightbox. Cant find a small solution for that.
There should be no new window. Just a content box which appear inside the page where i am. I hope u know what i mean
That should be pretty easy using the Easy Fancybox plugin.
Citing the entry from the FAQ section of the plugin's page:
Can I display web pages or HTML files in a FancyBox overlay?
Yes. First, enable the iFrame option on Settings > Media. Then, in your post or page content create a link to any web page or .htm(l) file in your content. Then switch to the Text tab in the Classic Editor or to Edit as HTML (under More options in the block menu) in Gutenberg, find the link <a ... > tag and give it a class="fancybox-iframe" attribute.
Voilà !
Beware, though, that:
Note: Not all external web pages are allowed to be embedded in an iframe and may be blocked by a server response header or script. The result will be either an empty/blank light box or the target page “breaking out” of the light box and loading in the main browser tab.
And you'd probably face the same problem with any other iframe solution. So that would work better with locally served pages.
I am having a big time issue with solving a problem. I have a placeholder called main for the content region of the page. I was building that region in the cms. Everything was going great until I attempted to add an embedded video contained in an iframe. When I save django cms completely removed the iframe and left an empty div. So I attempted to use prettyphoto light box to open the video by clicking on an image. The code I added to the page through the cms is:
<a rel='prettyPhoto[youtube]' href="https://www.youtube.com/embed/mqVZF_yb8C0?autoplay=1&start=1765&iframe=true" data-rel="prettyPhoto">Click Image</a>
When I saved, django cms completely removed the data-rel attribute from the link which is obviously needed for the js. So I went a step further and adapted the code of the data attribute to:
rel="prettyPhoto"
and the cms also removed that attribute! Also anytime I add an html5 tag like article of section it hates that too! What gives here? Am I doing something wrong? Any advice would be appreciated.
Aaron,
Thanks.
Please see the discussion at https://github.com/divio/django-cms/issues/1529. We use html5lib to clean the contents of the text plugin (this cannot be turned off for security reasons).
What you'll want to do is write a custom plugin (possibly one that can be embedded inside text plugins).
https://friends-with-you.myshopify.com/
I'm trying to develop my first shopify theme. I'm trying to load a stylesheet which is hosted on another server, but the CSS is not loading. If I copy and paste that CSS directly into a file in the shopify theme, it works.
<link type="text/css" rel="stylesheet" href="http://fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
What am I doing wrong at the above URL, and why isn't the css loading?
thanks!
Can you load your CSS file over both http and https? If so, change your tag to look like this:
<link type="text/css" rel="stylesheet" href="//fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
That way whether a user visits using http://yourstore.com or https://yourstore.com, they'll get the stylesheet served using the protocol they're on (and you won't get any mixed content warnings).
A little more background: http://paulirish.com/2010/the-protocol-relative-url/
Under IE7 and IE8, using this in a <link> tag will result in your content being fetched twice.
Change your link tag to use a secure URL:
<link type="text/css" rel="stylesheet" href="https://fwy.pagodabox.com/magic/themes/fwy/fwy.css" />
^
The URL you're using now works fine on its own, but since you're browsing to the Shopify store over SSL, many web browsers are going to be hesitant to load the CSS over an unsecured connection.
I just checked and pagodabox serves the CSS file just fine over SSL.
In normal HTML documents one can load stylesheets from anywhere, as long as they exist and you're able to load them by typing the URL in (which I can).
I see the page as two navigation bars with a logo on the left hand side. There are hover states with transitions to a colour background on each item. Although, when I loaded the page, Chrome warned me not to load supposedly insecure content. Before this is loaded I just see text in Times New Roman. I think this is you problem.
I use themes with WordPress and style-sheets come with them (mostly). I don't see why you couldn't just put the style-sheet in with the rest of the theme.
Overall, the answer is yes (normally) but in this case browsers may regard it as un-safe and therefore not load it.
Yes you can! But it is faster to host the stylesheet on your server/where the other files reside. If you plan to include a stylesheet from elsewhere, you could run into problems of that server being down/busy and hence your theme will not display as required. As #Blieque mentioned, some browsers may question external content causing unnecessary warning popups to a user/user-agent.
So here's an interesting conundrum.
I have a page, default.aspx. It has a LINK tag to a stylesheet, located in the CSS subfolder:
<link type="text/css" rel="Stylesheet" href="Css/Logon.css" media="all" />
The folder structure is as follows:
[Root]
[CSS]
[Images]
[Logon]
No big surprises. (Our default.aspx page is our logon page. Again, no big surprises.)
Here's the problem. If you launch the page in IIS, the page renders beautifully. CSS loads, fonts appear, everything is positioned appropriately, and lions are laying down with lambs.
If you view the page in WebDev, the stylesheet isn't loaded. Since it specifies all the images, fonts, and positioning, everything is black on white, in Times New Roman, slammed left against the window border. Dogs are chasing cats in circles and causing traffic accidents. Chaos ensues.
Why? How do I fix it? What information do I need to provide to reach a happy conclusion?
P.S. I am aware of the URL differences between running it in IIS and Webdev, but the differences don't seem to make much sense to me, due to one simple fact: the path to the style sheet is relative to the location of the default.aspx page. The stylesheet isn't being loaded at all. I can see this because there's no font styling at all.
My recommendation would be to use Firefox to load the page. With the Firebug add-on installed you can view the requests for the CSS files in the Net panel. This will allow you to at least see the path that is being used for the CSS file.
If you have not used the network monitoring feature in Firebug before you may want to go here:
http://getfirebug.com/network
We eventually discovered the cause of this problem using Fiddler: HTTP 401 (Unauthorized). A little more research uncovered that we needed to add explicit <location/> entries for the stylesheet, and all the images it referenced, to our web.config file.