Monthly Archives

April 2013

Summary of AzureConf 2013 Sessions

By | Uncategorized | No Comments

Last time, I summarized Scott Guthrie’s keynote session. This time, I’ll summarize some of the following sessions. Azure Websites – Things they don’t teach the kids in school This talk was actually not so much about Azure Websites as it was about the build system that Azure Websites uses to publish web projects from Git. The product is called “Project Kudu” and is an open-source project available on GitHub. The speaker demonstrated a number of  “power user” features of Kudu: Streaming the application log to the console This demo actually didn’t work, but this could be immensely useful to assist…

Read More

Summary of the AzureConf 2013 Keynote

By | Uncategorized | No Comments

I recently had the pleasure of attending the global AzureConf 2013 event broadcast live on Microsoft’s Channel 9. If you didn’t get a chance to attend and don’t want to spend the time to watch all of the sessions, I plan to summarize each of them over the next few posts. This is my summary of the keynote address. Keynote In the keynote, Scott Guthrie gave an overview of the current state of available Azure services, starting with the infrastructure itself. Windows Azure is flexible, supporting a variety of development languages and client platforms; open, with client SDK source code…

Read More

Downloading resources in HTML5

By | Uncategorized | No Comments

Here is a nice little feature that allows you to download a resource by simply adding a download attribute to an a element, as shown below. In this case, since the download is added, the file will be downloaded instead of navigating to the href. Keep in mind this only currently works in Chrome, but will hopefully be added to other modern browsers in the near future.

Read More

Gettin’ Funky with Google Fonts

By | Uncategorized | No Comments

One great way to add a unique look to your website is by using custom fonts. There are many ways to do this by using images, javascript, etc… Google Fonts is an easy way to add custom fonts to your site. The Google Fonts API is compatible with the following browsers: Google Chrome: version 4.249.4+ Mozilla Firefox: version: 3.5+ Apple Safari: version 3.1+ Opera: version 10.5+ Microsoft Internet Explorer: version 6+ To get started, navigate to www.google.com/fonts/. Once on the page, you’ll notice filtering features on the left. You can filter by thickness, slant, width, Serif, Sans Serif, and Handwriting…

Read More

Create a Responsive Layout Using Media Queries

By | Uncategorized | No Comments

Today we are going to create a responsive layout using media queries, you can download the source files here. While there are many ways to go about doing this, I am going to focus on 4 distinct layouts. One for desktop and Tablet Landscape One for Tablet Portrait One for Mobile Landscape One for Mobile Portrait To begin we are going to create a wrapper and give it a width of 1000px, this will be the default size for Desktop and Tablet Landscape. .wrapper { background: none repeat scroll 0 0 #efefef; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);…

Read More

Windows Phone 8 Development: Troubleshooting the Emulator

By | Uncategorized | No Comments

I just finished setting up my Windows Phone 8 development environment on a fresh operating system.  Everything went smoothly…and then I attempted to debug  a Windows Phone 8 app using the emulator.  That’s when things started to get difficult, and I mean really difficult! To be fair, I have several things working against me on this setup.  For almost two years, I have been happily running dual operating systems on a late-2011 MacBook Pro, and recently I installed a new hard drive and a fresh installation of Windows 8 Pro on a BootCamp partition.  In addition, I typically have no…

Read More

Enable Styling of HTML5 Elements in Early Versions of Internet Explorer using HTML5 Shiv

By | Uncategorized | No Comments

Today we are going to look into how we can enable styling of HTML5 elements in early versions of Internet Explorer by using HTML5 Shiv. What is HTML5 Shiv According to Wikipedia, “HTML5Shiv is a JavaScript workaround, discovered by Sjoerd Visscher, to enable styling of HTML5 elements in versions of Internet Explorer prior to version 9, which do not allow unknown elements to be styled without JavaScript.” How does it work First we need to target Internet Explorer borwsers before version 9. To do this, copy the code below, and place it in the head tag of your page. We…

Read More

Tips on working with the Telerik report designer

By | Uncategorized | No Comments

I’ve worked on some reports lately that push one limit or another. Here are a few things that I’ve learned along the way: Copy and pasting multiple report items When a report has repeating groups of items that you must place by hand, it is natural to want to copy and paste all of the items at once. However, when you do this, you will usually be treated to a display suddenly filled with little yellow "warning" signs indicating that the pasted items now subtly overlap one another, even though their location and size might appear to be perfect when…

Read More

Xamarin Evolve 2013

By | Uncategorized | No Comments

Just a quick update after day 1 of the Xamarin Evolve conference. The Xamarin Mobile Platform allows developers to use C#, and the .NET framework (via the Mono cross-platform implementation) to build applications for iOS, Android, and Mac OSX. Resultant apps are near-native and there is a potential for some major code reuse, provided your application is architected accordingly. First, the event itself: Overall I am very impressed with the production. Knowing that this is Xamarin’s first conference, I expected something short of the events I am used to seeing put on by the likes of Apple, Google, and Microsoft….

Read More

Creating a “Back to Top” animation with jQuery

By | Uncategorized | No Comments

Today I am going to show you a simple way to bring a viewer to your web site back to the top of a page, with an animation, using jQuery. You can download the source files, here. To start make sure your page is loading jQuery, you can do this via a local file or use one of many hosted jQuery files. In this example we are linking to a file hosted by jQuery.com. <script src=”http://code.jquery.com/jquery-latest.js”></script> The second piece of code you will need is a link with a little bit of JavaScript in it, shown below: You can choose…

Read More

Making Rounded Social Icons with CSS

By | Uncategorized | No Comments

Today I am going to show you how to make rounded social icons with css. You can download the source files here. I have set this project up so that you can create many different icon sizes, border sizes, border colors, backgrounds images, background colors, and light/dark themes. Let’s start with the first large Icon: Here is the mark-up <div class=”circle-container extra-large”> <div class=”box-1 stripe-2 blue-1 border-dark-grey border-10 shadow”> <img src=”images/facebook-white.png” /> </div> <p>Facebook</p> </div> Here are the styles in detail. */ =========== Floats the container =========== /* .circle-container {     float: left; } */ =========== Adds the border, you can also…

Read More

Marketplace Released for Falafel Tornado

By | Uncategorized | No Comments

Last month, we announced the release of Falafel Tornado, a widget builder allowing you to create HTML5 / JavaScript widgets like image carousels and blog rotators on-the-fly without having to compile or deploy. Today, we are excited to unleash the Falafel Tornado Marketplace to allow you to download and share widgets from your Sitefinity backend! The Falafel Tornado Marketplace comes as a slide-out from within the Content > Widget blocks area. No more trying to copy code from the community or cracking open your Visual Studio: Do you have a great idea for a widget that you would like to…

Read More

Caching and compression with web.config transformations (part two)

By | Uncategorized | No Comments

In yesterday’s post we looked at different web.config setting to help optimize a Sitefinity website in terms of caching and compression of static content. Naturally you don’t want caching to get in the way while developing and constantly having to resort to app-recycles and clearing of the browser cache. Enter web.config transformations  a perhaps not-very-well-known feature yet it has been available for a few years. Simply open your project in Visual Studio 2010 or 2012, right-click your web.config and click “Add Config Transforms”. Nested under your web.config, you’ll find 3 new files called web.Debug.config, web.Release Pro.config and web.Release.config. Each of those…

Read More

Falafel Adds Another Sitefinity Rock Star

By | News | No Comments

Capitola CA – 5th April, 2013 – Today Falafel Software is pleased to announce the expansion of its European presence with the addition of another Sitefinity rock star: Daniel Plomp. Daniel is both a Telerik MVP and a Sitefinity Certified Developer whose experience with Telerik products dates back to the original suite of RadControls. In 2008, Daniel founded Konstrui, a software consulting company in the Netherlands focused on delivering Sitefinity web applications. Over the past 5 years, Konstrui delivered more than 25 custom Sitefinity solutions to customers worldwide. Despite his long and successful history with Konstrui, Daniel was excited to…

Read More

Fixing Windows 8 Deployment Error: “Error : DEP0700 : Registration of the app failed”

By | Uncategorized | No Comments

I ran into an error when I was setting up a project in Visual Studio for an existing Windows 8 app I already had installed from the Windows 8 Store. When I tried to run the project in the debugger for the first time, I got the following error message: Error : DEP0700 : Registration of the app failed. Another user has already installed a packaged version of this app. An unpackaged version cannot replace this. The conflicting package is [MyProjectName] and it was published by [MyCertificate]. (0x80073cf9) This seemed odd to me since I had already uninstalled the app…

Read More

How to Create and Register a Theme in Sitefinity.

By | Uncategorized | One Comment

Here is a simple step by step tutorial on how to create and register a theme in Sitefinity. First go to: Administration > Settings Then click on : Advanced Next go to: Appearance > Frontend themes. Then, name your new theme and enter the path. If you don’t know the path you can copy the path of another theme in your project and replace the last part: Save Changes Now you can create the theme, got to: Administration > File structure. Next, navigate to your App_Themes folder: Create a new folder, and name your theme. Inside your new theme folder…

Read More

Caching and compression of static content with Sitefinity 5

By | Sitefinity | No Comments

In a perfect world you aim for everything to be cached, except the actual page content to minimize the download time and speed up a visitors user experience. Some caching might take place on the server, or by the browser but ideally you want to end up with a picture that looks somewhat like this: And while you can control the caching of the page content itself from within Sitefinity (page>properties) there is no built in method to control static content like javascript, css or images. In order to achieve this optimum setup, we need to turn to our web.config…

Read More

How to Convert an Inline Navigation to a Mobile Navigation

By | Uncategorized | No Comments

Today I am going to demonstrate one way to convert an inline navigation to a mobile navigation using media queries. View an example here. Or from this: To this: We start with a basic unordered list. <ul class=”falafelConNav”> <li><a href=”#”> About </a></li> <li><a href=”#”> Agenda </a></li> <li><a href=”#”> Sessions </a></li> <li><a href=”#”> Speakers</a></li> <li><a href=”#”> Sponsors</a></li> <li><a href=”#”> Venue</a></li> <li><a href=”#”> Register</a> </li> </ul> The idea is to change the css when the screen reaches a certain size, in this case 480px. to do this we use a media query like the one below: @media (max-width: 480px) { .falafelConNav {…

Read More

Icenium and Barcode Scanning

By | Mobile | No Comments

In my previous post,  I demonstrated how to implement a SQLite database in your Cordova mobile app using the SQLite plugin in Telerik’s Icenium IDE.  Now we will see how to add barcode scanning to your app using the Barcode Scanner plugin.  Previously, we built a Shopping List app that lets you add items, mark them as complete, and clear completed items while storing all data in a local SQLite database.  Now we will add a new “Scan” feature so users can scan a barcode to add items to their list. First, we need to add the Barcode Scanner plugin…

Read More