I am using sifr in the content management system cmsms, and for the first time ever I've experienced a problem with sifr.
http://www.improvingbiz.co.uk/index.php?page=e-commerce
Sifr is showing the text as well as the flash, resulting in this double headline!
I have sifr replacing #title and using the following in screen CSS:
.sIFR-hasFlash #title {
visibility: hidden;
font-size:0px;
}
...to no avail.
Required me to put the sIFR stylesheet into the CMS style sheet, it didn't like a link to an external sheet.
In general, sIFR is not a technique that should be used today.
Instead, use the #font-face css property, and allow users using older browsers to see their default fonts. This way you have progressive upgrades for the users who can support the newer features, but you don't break things for users of older (or very old) browsers.
Headlines should be images if you feel strongly about how they render. Style them with css if you need to. Look here for examples: http://www.csszengarden.com/
Flash is a really bad thing to require for titles because it slows load times incredibly for users of slower computers (netbooks, for example).
Related
I am looking for options on how to deal with an issue as I don't think there is an easy fix.
We're dealing with a really stubborn client that doesn't want to accept the fact that browsers don't print css backgrounds by default.
He's convinced that XP running IE 6 & 7 are the most common browsers and we are a bad company for not supporting them. (I've shown him analytics from our typical client's visitors but it hasn't changed his mind). I'm rewriting his site to work on them but am stuck with the print stuff now.
He would like (demand is a more accurate term) to have the page print exactly as it looks on the site as well as them look exactly the same in all operating systems & browsers. I don't think it's feasible to go through and put all the images in the html instead of in the css and I've tried the list-style tip without luck. Lots of the color of the site comes in from background css colors as well.
Is there any other options? Or even suggestions on how to deal with this client?
Try something like:
<style type='text/css'>
#import 'whatever.css' screen, print;
</style>
Make sure #import is above all other CSS tags, and that you target the external stylesheet that you have your CSS for your page on.
Here's a slightly different approach:
I would consider converting the web page to a pdf which you can print instead.
An nice way to do the conversion is through a product called PhantomJS. It's essentially a headless browser that will render the page and convert it to a pdf on the fly. You can integrate by running the PhantomJS server and add a link on the original page to download the pdf.
The pdf will then print the page consistently across all browsers. There is however a decent amount of additional work, so you have to consider if it's a good fit for your needs and timeline...
Additional complexity with this solution is that you have to host the PhantomJS javascript server somewhere, write a PhantomJS script using the API to convert your page to pdf.
Pdf and image conversions are relatively easy to do, but you have to also consider authentication if your pages require login. PhantomJS will write the converted file to disk on the server, so you would also have to manage downloads to the user's browser.
All in all it's a good chunk of work, but you might find it interesting to at least learn about it :-).
More info here:
http://phantomjs.org/
Is it possible to check if a device is iOS inside an HTML email?
I want to display Apple and Google maps schema links to the native apps, but only if the device supports it.
Had a look online and couldn't even find a hack in CSS. Shame there is no equivalent to the <!--[if gte mso 9]> tags. It looks like the answer is technically no...
Good thing in this case is that Mac has different CSS support to other clients, so you can leverage that as a work around in email.
Try using one of the CSS selectors (Nth child for example). These are CSS attributes that only mac recognizes.
Theoretically you could hide something by default and set the Nth child selector to show the Mac only content.
If you were really despirate, you could also display some 'mac only' text using RGBA or HSLA colors on the same color background (making it invisible).
Consider using the same link in the email, like example.com/emailLink, where that endpoint on your server is server-side code (like PHP) detecting the browser and then delivering the link you'd like.
http://chrisschuld.com/projects/browser-php-detecting-a-users-browser-from-php/
I'm working in a Blackberry app (OS 5.0) and need to show recent tweets of the user.
I'm able to get the data from Twitter's end. Now after parsing the entities (hashtags, urls, user-mentions etc), I need to display them with separate formatting (color, bold etc). So I'm using different LabelFields for different parts of the tweet.
But LabelFields are by default block elements. How do I put those LabelFields inline, so that it looks like how it is shown in Twitter?
like this:
Others have suggested RichTextField but you'd have to write your own text filter to colour the syntax - it's going to be a lot of effort. If having the clickable links inline is a must then personally I'd use a BrowserField but that would mean your logic would have to output a full screens worth of tweets into html (screens don't like having more than one browserfield - it's doable with more than one but there's some hacks) and manage the click events - more complications.
Alternatively you could do something like this: http://devblog.blackberry.com/2009/10/how-to-use-table-view-layout/ You wouldn't have clickable regions within the text body but it'd still be using native fields instead of 'cheating' with markup, probably the best way.
I've found that there's a component in Blackberry SDK called ActiveRichTextField which automatically scans its contents and parses links making them focusable and clickable. Furthur it'll also parse entities if Twitter app is installed in that device. For now it solves my problem. Thanks guys.
How can I stop search engines indexing part of my page? Is there an HTML5 element for this?
Its just a line of text that I want to hide (a co-worker doesnt want their name on google for some reason). Im thinking that I could inject the text with javascript, but I have heard google does sometimes look inside javascript files.
I also thought of using images instead of text, but im concerned how this will look cross device and platform. Ive noted text rendering can differ on mac and pc and thats before ive had to think about mobile devices, retina displays, etc.
Thanks
You can't hide content unless you use the methods you've already outlined above. Your best bet is to use JavaScript in an external file and then block that file using robots.txt.
I'm using sIFR on a website that is database driven and it works great. However, I have a news rotator on the home page and sIFR won't replace the text on the tile below the rotating image, so I have to create images for this each time.
Example of the site is http://www.aucklandcityfc.com. Put home.asp on the end of the URL to see what it looks like trying to run sIFR by default.
What I'd like to be able to do is use sIFR to replace that text as well, and then other people can add stories through the CMS.
Alternatively, if there's a better rotator (or possibly a Flash application) that anyone knows of, please let me know.
Thanks,
Adam
You can insert the new text and then replace the element again; or use the replaceText API method to change the text inside an existing sIFR Flash movie.