Upgrade Your Drupal Skills

We trained 1,000+ Drupal Developers over the last decade.

See Advanced Courses NAH, I know Enough
Jan 08 2014
Jan 08

A client recently asked us for help with a very specific issue. The node edit page was hanging up, but only in Internet Explorer 10, and not in Firefox or Chrome. The client had WYSIWYG editor enabled.

This automatically pointed to a front end issue, not a server issue.

So, we investigated more, and found that the underlying issue is between Internet Explorer and JQuery with a large number of items to be parsed.

Internet Explorer was not able to parse the high number of token items listed (around 220). This causes the browse to hang when rendering the WYSIWYG page, with the following error message:

A script on this page is causing Internet Explorer to run slowly. If it continues to run, you computer might become responsive.

With the option to stop the script.

The real problem is with the critical issue described in #1334456, which is as yet not committed to the repository of the token module.

Fortunately there is an easy workaround, the steps are:

  • Install the Token Tweaks module.
  • Go to /admin/config/system/tokens.
  • Change the Maximum Depth limit from the default of 4 to 1
  • Save the changes.

Now the edit form for the node should work normally, and the browser, whichever it is, will not hang anymore.

Note: Thanks to Dave Reid for this workaround.

Sep 13 2011
Sep 13

From the get-go, Square Grid has been intended to offer less. Sometimes less is more, especially so when it comes to front-end web development.

Square Grid is a Drupal 7 base theme* leveraging the design and implementation power of Square Grid, combined with principles of responsive design. It's been in active development, with new features and the odd bug fix pushed live periodically over the past several months. Here's where the theme stands now.

More options, still lightweight

Since its first incarnation, Square Grid has grown a bit – not so much in code but rather in flexibility. It's still pretty lightweight.

Configurable tools

Square Grid configuration options are inherited and available to your child theme's settings page. These include:

Configurable responsiveness options

Responsive support has been part of the theme since April. Now you can configure whether you want it, and if so how much.

squaregrid config screen
You can turn the responsive support on and off.

However, it's not just a matter of turning responsive support on or off: You have various options.

squaregrid config screen detail
If responsive support is enabled, you can choose what grid sizes to utilize in the theme.

squaregrid config screen detail
If you do not want responsive support, you can choose a universal grid size for all screens.

The theme does only what you've planned for.

Internet Explorer options

You can decide how to handle Internet Explorer up through version 8, which does not recognize media queries.

squaregrid config screen detailIE support options can be configured as well.

Options include one static grid size, or no special handling (in case you want to use a JavaScript-based solution such as Respond.js).

Simple built-in development aids

Grid-based theme development sometimes can get quite involved when working on an actual Drupal codebase, not just mockups or prototypes.

squaregrid config screenFrom Square Grid-enabled theme configurations.

With these seettings, you can toggle on/off display of the actual grid and rebuilding the theme registry on every pageload.

Behind the scenes, what you get are:

A grid for most occasions

Square Grid grid
As illustrated here, Square Grid framework facilitates a wide variety of design grids, from 4-column to 12-column to Golden Ratio, all from one grid schema.

The lightweight Square Grid Theme builds off of the powerful flexibility of Square Grid framework by Avraham Cornfeld. See http://thesquaregrid.com for more on Square Grid concepts, templates and more.

Lightweight CSS

The styles predefined in the theme are as minimal as possible, focusing only on page layout. The idea is that you, the themer or front-end developer, will want to control the rest.

Mobile first architecture

The theme styles for single-column, optimized-for-smaller-screens layout first, and adds multi-column grid-based layouts in addition for screens 770px and larger.

Content-first page loading

Nothing irks more than loading secondary content before the main content. It makes people wait longer to see what they clicked to see, raising click-aways. This theme loads your main content first, then the secondary content.

Straightforward grid column settings

These can be overridden in your child theme's template.php. No heavy PHP knowledge is required, and all necessary code is provided.

No extra extras

It's tempting to add more bells and whistles, but the goal is not to add complexity or steepen your learning curve with bespoke variables or code concepts.

There's more on these features and characteristics in the official documentation.

Not a fluid grid

Square Grid is not a fluid grid. Why? Because even today browsers do not agree how to render out elements defined with floating decimals. A fluid 35-grid layout would require a grid of %2.857... per grid square, which means that a fluid layout defined by percentages would entail added complexity and possibly some browser hacks, especially when you multiply browser-imposed roundings and truncations by 35.

Some people still prefer 100% fluid layouts, and that can make sense, especially in some use cases, such as an expert-interface dashboard requiring as much screen-estate as possible. However, if the static grid widths adapt to the screen sizes, the marginal benefits of going 100% fluid are somewhat minimized. Therefore, given the floating point issues noted above, Square Grid, as a base theme, supports multiple fixed-grid widths that offer healthy screen-estate usage for the most-commonly used screen sizes. (Count me in the school of thought that it's all responsive.) An added benefit is that, by defining these break points, the theme renders with more predictability for design purposes. The current 770px-, 980px- and 1190px-width break points in Square Grid Theme cover most larger displays, while still providing comfortable, readable layouts. As screens get larger, we can build upon this paradigm. And we're not ruling out fluid grid definitions altogether. (See below.)

Road map items

Here are some things in the works (in no particular order):

An HTML5 version

This is already in the works. [Meta issue]

"Nav last" page structure

Currently, Square Grid loads the main menu before the content — something I always immediately remake in any child theme. While there are still some naysayers, most agree that loading nav last is best practice for mobile display. This means that Square Grid should load the nav last, just before the footer. How this gets styled for proper placement, though, depends very much on the specifics of the design. That's why I have not done this yet, but I may add 3-4 lines of CSS to handle this. [Issue]

Configuable column widths

These would be configurable "sidebar" widths settings, to make it easier for you to just get on with implementing your design. (Column widths are fully workable in the theme currently, but customizing them does involve some code editing to change integer values in the child theme's template.php file.) [Issue]

1400px-wide layout

This has been partially implemented (and disabled in code pending completion) and likely will be in one of the next releases. [Issue]

Fluid layout

Comments above notwithstanding, this could be an option with potential appeal to some themers. Caveats about variable browser support would apply, of course. [Issue]

We hope Drupal users working to implement custom designs on their own sites find the Square Grid Theme useful.


Feb 23 2010
Feb 23

Michael B. from the Mozilla Marketing list recently posted an hypothesis on why Google Chrome may suddenly start taking a much larger chunk out of the browser market now that Microsoft’s browser selection screens are appearing in the EU.

I’ve a hypothesis to explain Chrome’s recent and sudden surge of usage share the last couple months. Let me first say that almost every time I ever ask what web browser someone uses, the answer I get is Google. After I explain that Google is a search engine, not a web browser they usually tell me that they have no idea. I later find out that they are either using Internet Explorer or Firefox. Enter Microsoft’s new browser ballot into the equation. Instead of just saying “Chrome,” Google’s web browser says “Google” and then says “chrome” in smaller letter. People are asked what web browser they want so they think, I want to search with Google of course so they choose Chrome. If this is the case, it might be a problem that should be addressed.

Perhaps user ignorance on what a browser actually is will give Google a major boost.  Because, admittedly, even my own father reference to Internet Explorer as “my internet”.

Reblog this post [with Zemanta]

Share this:

Feb 21 2010
Feb 21

Microsoft Browser Choice ScreenWe might finally get more people off of IE, FINALLY.

It might seem like a minor thing, but it isn’t.

Microsoft has been fined billions over browser choice (or lack thereof) in Windows, and the solution that finally satisfied EU regulators was a browser choice screen, which would let users choose a web browser rather then having Internet Explorer installed as the default.

Now, Microsoft has posted images of what the browser choice screen will probably look like.

Here’s how it will work: The user will be presented with five major browsers, randomly ordered. He will also be able to choose several additional browsers, which are also randomly ordered. Once you install a browser, you’ll get a shortcut of that browser on your desktop, while Internet Explorer will be unpinned from the taskbar.

Since Windows 7 has been available on the European market for quite a while now, one may ask why (and how) is this happening so late? Since Microsoft needed some time to implement the browser choice solution, it will now use Windows Update to provide the browser choice screen to European users who are using Internet Explorer as their default browser. Better late than never, huh?

More precisely, testing of the browser choice screen begins next week in the UK, Belgium and France, where users will be able to download the software update from Windows Update if they like. A phased rollout of the update will happen across Europe starting with March 1.

via Europeans Get a Taste of the Browser Choice Screen.

Reblog this post [with Zemanta]

Share this:

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web