Is there is way to automatically switch the default template used in joomla based on the users browser? For instance, I am currently using Gantry framework for one of my websites, it would be a tonne of work to accommodate IE6, 7 and 8 into this framework, I was wondering if there's a script that will detect the users browser, say IE7, and if the user is using this browser Joomla automatically switches to a template that is compatible with that browser?
Yes, there is a way, it is called "Conditional Comments".
Conditional comments are a special type of HTML comments that work as conditions, and they are mostly used to check Internet Explorer version (because of css-compatibility).
Vocabulary:
lte: less than or equal to
gte: greater than or equal to
lt: less than
gt: greater than
!: not
This is the use of conditional comments:
<!--[if <something from vocabulary> IE <version>]>
code
<![endif]-->
Let's see some examples
<!--[if IE]>
You are certainly running Internet Explorer<br />
<![endif]-->
<!--[if !IE]>
You are certainly NOT running Internet Explorer<br />
<![endif]-->
<!--[if IE 6]>
You are certainly running Internet Explorer version 6<br />
<![endif]-->
<!--[if lte IE 6]>
You are certainly running Internet Explorer and it's version is lower or equal to 6<br />
<![endif]-->
<!--[if gte IE 6]>
You are certainly running Internet Explorer and it's version is greater or equal to 6<br />
<![endif]-->
<!--[if lt IE 6]>
You are certainly running Internet Explorer and it's version is lower than 6<br />
<![endif]-->
<!--[if gt IE 6]>
You are certainly running Internet Explorer and it's version is greater than 6<br />
<![endif]-->
it would be a tonne of work to accommodate IE6, 7 and 8 into this framework
In fact, joomla templates are made of some css files, named template.css, template.ie6.css, template,ie7.css, etc.
this is not a tonne of work, because the template.css contains the FULL template css, and template.ie#.css files contains only those rules which need to be overrided in order to work with a specific version of IE.
Then, in the template index file, there are some Conditional Comments that switch the css according to the browser you are using
SOURCE: http://www.quirksmode.org/css/condcom.html
Related
One of our clients has recently upgraded their sitecore from 7.0 to 8.0 and they used to work with VersionFromLanguage module to duplicate same content to multiple languages. But after upgrade, the content editor crashes with following error if the module gets activated (by enabling its config file):
Could not load type 'Sitecore.Shell.Applications.WebEdit.Commands.WebEditCommand' from assembly 'Sitecore.Client, Version=8.0.5245.0, Culture=neutral, PublicKeyToken=null'
I was thinking about better techniques such as language fallback in long term but is there any quick fix to this module? (It must be something about the way buttons get registered on SPEAK UI comparing to older shell API, I guess)
A quick fix is to switch to Sheer UI.
In Sitecore 8, the Experience editor by default uses SPEAK for the ribbon.
To use old Sheer UI (if is an option for you ) you need to modify Sitecore.ExperienceEditor.config
<pageextenders>
<!-- Uncomment the page extenders below and comment the "Sitecore.ExperienceEditor.Speak.Ribbon.PageExtender.RibbonPageExtender" to switch to old SheerUI-based Experience Editor ribbon. -->
<pageextender type="Sitecore.Layouts.PageExtenders.PreviewPageExtender, Sitecore.ExperienceEditor" />
<pageextender type="Sitecore.Layouts.PageExtenders.WebEditPageExtender, Sitecore.ExperienceEditor" />
<pageextender type="Sitecore.Layouts.PageExtenders.DebuggerPageExtender, Sitecore.ExperienceEditor" />
<pageextender type="Sitecore.Shell.Applications.Preview.SimulatedDevicePreview.PageExtenders.PreviewExtender, Sitecore.ExperienceEditor" />
<!-- Page extender for SPEAK-based Experience Editor ribbon. -->
<!--<pageextender type="Sitecore.ExperienceEditor.Speak.Ribbon.PageExtender.RibbonPageExtender, Sitecore.ExperienceEditor.Speak.Ribbon" />-->
</pageextenders>
On next links you will find information about how to customize ribbons in Sitecore 8 and what steps you need to follow to fix your issues into Sitecore 8.
http://www.programmingbynumbers.com/2015/01/31/creating-a-new-experience-editor-button-in-sitecore-8/
https://doc.sitecore.net/sitecore_experience_platform/the_editing_tools/customize_the_experience_editor_ribbon
Up until recently I was including the file...
https://raw.githubusercontent.com/rwjblue/ember-qunit-builds/master/dist/globals/main.js
...in a 'TestRunner' page which I would open to run all of my Ember unit tests. All was great.
A few days ago, that file disappeared from github, so I started searching for the new way get my unit tests (e.g. moduleForComponent tests) running.
I first tried to simply include the ember-qunit.js file from the ember-qunit-builds repo, but errors like could not find module 'ember' came back.
Am I correct in saying that ember-qunit somehow depends on ember-test-helpers? I'm a bit lost as to which references I should be including before my test code...I have a feeling that I'm missing something related to ES6-style modules (export/import etc) with which I have little experience.
Could somebody perhaps point me in the right direction here? What should I be including on my 'TestRunner.html' page to get the 'moduleForComponent'-style tests happening again?
Note: I'm in a .NET environment where I understand that the frequently-mentioned tools for 'installing' this stuff (like Bower/npm) are not really available (are these a necessity for getting this to work?).
I'm not really sure where your problem is, but I can paste you relevant parts of my index.html (I'm using Ember App Kit here):
<!-- #if tests=true -->
<script src="/vendor/ember-shim.js"></script>
<link rel="stylesheet" href="/vendor/qunit/qunit/qunit.css">
<script src="/vendor/qunit/qunit/qunit.js"></script>
<script src="/vendor/qunit-shim.js"></script>
<script src="/vendor/ember-qunit/dist/named-amd/main.js"></script>
<div id="qunit"></div>
<!-- #endif -->
and
<!-- #if tests=true -->
<div id="qunit-fixture"></div>
<script src="/tests/tests.js"></script>
<script src="/tests/test-helper.js"></script>
<script src="/tests/test-loader.js"></script>
<script src="/testem.js"></script>
<!-- #endif -->
If you're looking particularly for the dist/globals/main.js file, then you can always go to github and select an older tag (not master), then go to the file's raw version. Here's the link to the 0.1.8 version:
https://raw.githubusercontent.com/rwjblue/ember-qunit/v0.1.8/dist/globals/main.js
If you want to stay up-to-date, use this repo:
https://github.com/rwjblue/ember-qunit-builds
Does this provide any help?
I'm writing a rails application in a RTL language (right to left).
I'm using Less and Twitter Bootstrap for my front-end framework.
To have my site completely RTL I use the CSS files I downloaded and copied from rbootstrap:
http://rbootstrap.ir/
to assets/stylesheets
Everything works great RTL besides the nav-tabs that are still on the left side.
I tried playing with it a lot and this is what I found:
- If I delete the file bootstrap_and_overrides.css.less a lot of bootstrap's features don't work but the nav-tab does align perfectly to the right.
Every time I try to add something in my bootstrap_and_overrides.css.less I get the same error:
Unrecognised input
(in /home/bellonet/poligaffes/app/assets/stylesheets/bootstrap_and_overrides.css.less)
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.1/html5shiv.js" type="text/javascript"></script>
<![endif]-->
<%= stylesheet_link_tag "application", :media => "all" %>
<!-- For third-generation iPad with high-resolution Retina display: -->
<!-- Size should be 144 x 144 pixels -->
Only way it worked at the end, was using the original css and js files of rbootstrap directly without less.
That solved it.
I want to test for the user's browser. If Internet Explorer, then this paragraph. else this paragraph.
How do I do that in a django html template?
Thanks!
Don't do it using Django. Use conditional comments. Example:
<!--[if IE]>
According to the conditional comment this is Internet Explorer<br />
<![endif]-->
<!--[if gte IE 5]>
According to the conditional comment this is Internet Explorer 5 and up<br />
<![endif]-->
<!--[if gt IE 6]>
According to the conditional comment this is Internet Explorer greater than 6<br />
<![endif]-->
Django templates are rendered on the server side, what actually goes to the browser is the output is the rendered template. So you can't write browser specific code in the template, unless you capture that information from the request, pass it as a variable to the template, when you render it, which then uses that value to produce browser specific code.
Don't. There should almost never be a need for this. If you really really think you need it, use IE's conditional comments.
Some older browsers are vulnerable to XSS attacks as such
<img src="javascript:alert('yo')" />
Current versions of IE, FF, Chrome are not.
I am curious if any browsers are vulnerable to a similar attack:
<img src="somefile.js" />
or
<iframe src="somefile.js" />
or other similar where somefile.js contains some malicious script.
All major browsers are still vulnerable to these attacks.
Tons of ways of using img tags are still around..
For example...
<img src='#' onerror=alert(1) />
Look for RSnake's xss cheatsheet, those are just some vectors. By the way, I've heard he's coming up with a new version of his cheatsheet soon.
No. Image data is never executed as JavaScript. The if the src is a JavaScript link, the JavaScript is executed, but the fundamental reading of data that comes from a request to the src does not involve JavaScript.
here you can find some XSS attacking vector
http://ha.ckers.org/xss.html