HTML entities are not displayed properly - wordpress

I'm building a website with Wordpress, but sometimes (I don't know why) the html entities declared in my php files are displayed as a � (a black diamond with a white question mark). My charset attribute is already set to UTF-8 (as shown in the picure below). It could be a problem of the text editor (I'm currently using the built-in editor of Aruba)... How can I make sure that the encoding is right?

Try copying your code files into notepad++ and make sure that the encoding is actually set to UTF-8 without BOM.

Related

Chrome does not seem to follow link to css sylesheet. IE and Edge OK [duplicate]

Okay, something just went crazy. Unless China is taking over starting with my test style.css file on my iepage - well I guess they are starting off on the right foot hating on IE, but anyways. It loads with no stylesheet - sad :( I go into the Web inspector and see that all my linked files are filled with [possibly] Chinese characters (瑨汭笠ऊ楷瑤...) I have tried deleting the files on the server and re-uploading them. The local files look fine and when loading the files directly they look fine. I didn't do anything that should of changed the rendering or anything either.
So I think I figured it out. This is weird. But anyway.
I copied and pasted your HTML to a local file to experiment with. And it loaded just fine. It was saved as UTF-8. Then I changed it to UTF-16, and I got exactly what you're seeing! As far as can tell, the browser (Firefox for Linux for me) is assuming the linked files are all in the same encoding as the HTML...
So - I assume the file on the server is in UTF-16, and if you change it to UTF-8 you should be good. Hope that fixes it!
PS: According to Firebug, your HTML is compressed by your server, even if you never explicitly told it to. But that doesn't seem to be causing any problems, thankfully.
I encountered this same problem with XML files exported from PowerShell that were embedded in iFrames.
There was no issue in IE10/11 or Edge, but Firefox and Chrome wouldn't load the stylesheet.
The original page loading the iFrames was UTF8 encoded, same with the stylesheet. However, the XML file was exported to UTF16LE ("Unicode" in PowerShell). When the XML file was loaded from the iFrame, it loaded the stylesheet as Chinese characters.
I converted the encoding in PowerShell...
Get-Content C:\foldername\file.html -Encoding Unicode | Set-Content -Encoding UTF8 C:\foldername\file.html
...and it worked! My guess is that IE must treat the encoding of all files the same as the parent, which meant that the UTF16LE encoded file was rendered as UTF8. Chrome and Firefox apparently don't do that.
Thanks Xavier Holt for setting me on the right path!
Another quick solution is to change the file encoding using Notepad.
Open the file in Notepad and Save As with the UTF-8 option selected from the drop down
it may be the .html file itself. I solved my similar problem by copying the contents of the original .html file and pasting it into a new file with the same name in the same directory (change the original's file name at first and delete the remainder of course)

Fancybox appearing at bottom of page when site is in wordpress

I built a static site initially and am now in the process of converting it to a wordpress site. You can find it here The last image in the right column, when clicked, should open up a fancybox and play a video. It worked very well in the static site, but for some reason in wordpress the box appears at the bottom of the page instead of the center. I'm pretty sure it is seeing the css because I can click on the link and find it.
This is the result of the validation of your page
http://validator.w3.org/check?uri=http://training.mercury.stellarbluewebdesign.com/LittlestTumorFoundation/
Notice the comment :
Byte-Order Mark found in UTF-8 File.
The Unicode Byte-Order Mark (BOM) in UTF-8 encoded files
is known to cause problems for some text editors and older
browsers.
Also notice
Line 1, Column 1: Non-space characters found without seeing a
doctype first. Expected <!DOCTYPE html>
Passing your code through an editor in ansi mode (and showing all symbols), this is what I get :
Those preceding hidden characters before the DOCTYPE in your document makes your browser run in quirks mode hence the unexpected behavior of fancybox (which needs the document in standards mode to run properly)
What you have to do is to save your WP (php) files in an editor using UTF-8 without BOM encoding and upload them again (and alternatively forcing your ftp software to upload in binary mode)

Special char added to css (​) where did this come from?

I was doing a bunch of search-replace operations in notepad++ to effectively minify my css - mostly removing whitespace/tabs etc...) This ended up breaking much of my css.
Apparently a strange character (​) was inserted all over the place) Using notepad++ in UTF-8 without BOM, I cannot see these, but they appeared in a view-source.
I was able to remove these by doing a search replace in ANSI encoding, but my question is, what is this character, and why might it have appeared?
The string “​” is the UTF-8 encoded form of ZWSP when misinterpreted as windows-1252 encoded data. (Checked this using a nice UTF-8 decoder.) This explains why you don’t see it in Notepad++ in UTF-8 mode; ZWSP (zero-width space) is an invisible character with no width.
Apparently browsers are interpreting the style sheet as windows-1252 encoded. Saving the file with BOM might help, since then browsers would probably guess the encoding better. The real fix is to make sure (in a server-dependent manner) that the server sends appropriate Content-Type header for the CSS file.
But if this is the only non-Ascii character in your CSS file, it does not matter in practice, after you have removed the offending data.
I don’t know of any simple way to make Notepad++ insert ZWSP (you could of course use general character insertion utilities in the system), so it’s a bit of mystery where it came from. Perhaps via copy and paste from somewhere.
Using the web developer plug in or ext in Firefox you can see the problem character in the css document.
In Visual Studio all I could see was:
}
.t
Web developer showed an unwanted hidden character, an "a" with a caret on top:
}
â.t
The utf encoder link above revealed this
} (the encoded character for ampersand)
.t
and this
but simply fix the problem by deleting and retyping.

Arabic Locale Support in Flex

Today, I learn how to localize my Flex application and to support multiple languages. The tutorials on-line are great. However, non of them mention the Arabic locale.
So basically, I created the Arabic (Jordan) locale files in the SDK folder by using:
copylocale en_US ar_JO
I navigated to the locale folder and I was able to see the ar_JO folder in there... So I assume everything went smooth.
Next, I followed the tutorials (www.babelfx.org) and was able to localize my test application in English, French, and Arabic. Clicking on any of those languages switches the labels of my simple form/into the desired language... however:
When switching to the Arabic language the labels turn into empty square symbols. If you are wondering, yes I can open a notepad and type Arabic text and save it successfully.
When I type Arabic text into the text boxes, I can see the Arabic words that I typed correctly (the labels are still square symbols).
Any ideas what I might be missing here??
I tried changing the font of my application (right on the application tag I set the fontFamily) into Simplified Arabic which comes by default on Windows.
Thanks
Have you embedded a font into your swf which can render Arabic? Are you using that font? If the answer is no to either, then I suggest reading up on the subject.
One thing to remember about Flash and fonts is that it has incredible power which comes from the fact that one is able to embed actual fonts into the swf itself. One also needs to remember that Flash is incredibly finicky and is prone to throwing fits if you fail to do so.
The solution is to change the context-type to UTF-8. Three ways to accomplish this from within Flex Builder:
(Option 1) Right click the file from the File Navigator and select Properties
(Option 2) With the file open, navigate to the File menu and choose Properties
(Option 3) With the file open, press Alt + Enter to bring up the file Properties
Once the properties window is displayed, you will see the option to change the file encoding from Default to Other (UTF-8).
Note: At least for me, once I changed the content-type to UTF-8, I had to close my unsaved file, open it back up, and paste my contents back into the file in order to clear the error message. Then clean the project (Project -> Clean...) and let it rebuild.
I found the solution. Actually, I didn't have to embed any fonts or anything in order to get it working.
My problem was the encoding in the resources.properties file. I opened it in Notepad++, then I noticed the Encoding menu. At that time, I remembered reading something about that the encoding of the resources files should be UTF-8. So I converted the encoding to UTF-8 from the menu, compiled, it didn't work! After couple of retries and cleaning the project, it worked successfully!!!
Just a reminder for everybody (as I have fallen into this while working this problem out):
For mx components, embedded fonts must have the embedAsCFF set to false.

css file still not loading

I'm still having problems with loading the style sheet for these pages. Works fine in Safari but ff and IE, no joy:
http://www.mainstayprojects.com/teardrop.html andb
www.mainstayprojects.com
Although i am more clear as to what's causing this problem, thanks the the answers to my previous posting (stackoverflow.com/questions/3273655/css-file-not-loading), I am at a loss to how to fix the issue. I have re-saved many times with different doctypes and content type meta tag as well as saving the file as a charset=utf-8 file but have not been able make any headway!
Really need some help.
Your server is still claiming the HTML document is ISO-8859-1 (although the document itself looks like UTF-8).
Meanwhile the stylesheet appears to be UTF-8, the server fails to state what encoding it is, and the first line of the stylesheet claims that it is UTF-16.
Pick an encoding
Configure your editor to use it
Configure your server to specify it
If you put any information about the encoding at the document level — get it right!

Resources