Below you will find pages that utilize the taxonomy term “Tutorials”

Post

Hugo + Node.js Koa App Connected to MongoDB

This project demonstrates how to create a development environment utilizing a Docker stack of Nginx to serve the static website, Nodejs for the api applications, MongoDB for the api data and Traefik for reverse proxy. This stack is suitable for deployment to staging and production environments. Prerequisites These products will need to be installed in order to complete this tutorial. Docker Docker Compose Hugo Node.js Project Setup Create a directory for the entire project, e.
Post

Slick Carousel Responsive slidesToShow Recipe

Designs typically require more than the out of the box demos provide, which is understandable. The slick carousel demos will get you most of the way there and provide examples for various settings. This post is an example of how to dynamically update the slick slidesToShow value as the viewport is resized, demo. Getting Started In this tutorial, we’re using the Parcel web application bundler to compile all of source code and load it in a development web server.
Post

Hugo Content with Pages and Navigation

While converting my WordPress content into markdown files for Hugo, I wanted to keep my permalinks exactly the same. For my existing content that spans more than a single page, I created a way to do this without server rewrite rules or Hugo aliases that use meta refresh which is sub-optimal for SEO performance. May 20, 2019 – Corrections have been made to address some issues discovered in the instructions from the original post.
Post

Hugo Static Site Generator Blank Starter Theme

I’m in the process of converting my WordPress site into a static site compiled from markdown files using the Hugo static site generator. For this task, I created a blank Hugo starter theme that uses Webpack and optional webpack-plugin-serve for UI development build live reload. screenshot Source Code Pre-requisites You will need Git and NodeJS with NPM installed. Installation For example, if your Hugo website is in the www folder.
Post

AEM Dispatcher CentOS Virtual Machine Setup

How to setup AEM Dispatcher on a CentOS Virtual Machine (VM) alongside Author and Publish instances. This solution gives an Adobe Experience Manager developer a complete end-to-end environment for local AEM development. For this CentOS VM, I downloaded the Minimal ISO from centos.org/download. The ISO filename was CentOS-7-x86_64-Minimal-1810.iso at the time of this writing. Create your VM using the Virtual Machine program you prefer. Popular options are VirtualBox, VMware or Hyper-V (Windows only).
Post

Xdebug for Mac OS X PHP

Follow these instructions for PHP provided with Mac OS X to phpize Xdebug source, configure, build and install the PHP Xdebug extension. On Mac OS X Mojave, use the Xdebug extension included with the system in /usr/lib/php/extensions/no-debug-non-zts-20160303. Download the latest version of Xdebug. Verify that PHP is installed. e.g., php -v # output PHP 7.1.19 (cli) (built: Aug 17 2018 20:10:18) ( NTS ) Copyright (c) 1997-2018 The PHP Group Zend Engine v3.
Post

New Webpack Development Server Plugin

webpack-plugin-serve logo I always thought it was odd to use the webpack-cli command webpack-dev-server instead of webpack in my npm script for development. Lo and behold, last month, webpack-plugin-serve was released, a new webpack plugin to use instead of the quirky webpack-dev-server. I’m using the fairly basic split configuration from my uiCookbook/sidebars application to demonstrate how to replace webpack-dev-server with the new webpack-plugin-serve plugin Requirements Active LTS Node version, e.
Post

How To Create a WordPress Shortcode for flickr Albums

How to create a WordPress custom shortcode to display photos from flickr. This post documents using the Slick Lazy Load Photo Grid along with the flickr API to render photo albums in Wordpress Posts wherever the shortcode is entered. Webpack 4, autoprefixer, and babel are included for building the JS and CSS. Requirements flickr API key. From their API page, select the Create an App link for more information on how to request an API key.
Post

CSS Flexbox with Sidebars Toggle

This post documents how to create a fully responsive flexbox content layout that contains a pure CSS open/close toggle for the left and right sidebars. The CSS is built from Sass using Webpack with Autoprefixer. For development, a Webpack Dev Server is included. Features Pure CSS Sidebar toggle Sass CSS preprocessor PostCSS Autoprefixer CSSnano Webpack 4 Webpack Dev Server demo and edit this code in our online sandbox
Post

Completely Blank (no css) _s WordPress Starter Theme

This post documents how to take the WordPress Starter Theme _s or underscores, if you like and build only the CSS components you want using Webpack 4. This modern toolset also includes autoprefixer and browserlist support. You might only want the normalizer and accessibility modules, any combination of modules, or none at all to start with a completely blank slate. This build process will give you a solid foundation and all the latitude you need.
Post

Completely Blank (no css) _s WordPress Starter Theme - Page 2

In the src/js/index.js javascript entrypoint file, import the style Sass entrypoint as follows. index.js import '../sass/style.scss' Add this bit of code to the .babelrc congfiguration file. Consult the babel docs for config changes based on the babel version as needed. .babelrc { "presets": ["env"] } Add this code to require the autoprefixer postcss plugin to the postcss.config.js configuration file. postcss.config.js module.exports = { plugins: [ require('autoprefixer') ] } The package.
Post

Git Updates for Windows, PowerShell and WSL Ubuntu

Git released new versions of their version control software last month and documented here is my experience installing version 2.18.0 64-bit Git for Windows and version 2.18.0 built from the source on WSL”) Ubuntu. After installing version 2.18.0 for Windows, I was puzzled when all of the files were showing as modified directly after cloning a repository. When files are showing as modified, this can sometimes be caused by different file line endings such as LF or CRLF.
Post

WordPress from Development to Production using Docker Part II

This post continues where part one left off. Topics include mysql data migration, staging and production docker configurations with optional https. To perform these steps, you will need to either: Create the files directly on the server using nano, vim or some other command line editor. Create the files on your local machine and copy them to the server using scp. I prefer the latter method.
Post

WordPress from Development to Production using Docker

This post will cover how to use Docker for a local WordPress development environment and how to deploy it to an Ubuntu Linux server running docker. What you will need. Docker VPS with Docker (for prod deployment) WordPress The first step is to get your local development environment set up for your WordPress site. There are quite a few ways I have setup this environment in the past.
Post

SSL Certificate Authority for Docker and Traefik

This post documents how to get https working on your local Docker development environment using Traefik as a reverse proxy for multiple services. Step 1 - Root SSL Certificate Create a sub directory to store generated keys, certificates and related files in your home folder, for example .ssl. Using OpenSSL, generate the private key file, rootCA.key. For Windows, use Cygwin, Git Bash, PowerShell or other Unix-like CLI.
Post

Webpack 3 Sass cssnano Autoprefixer Workflow II - Page 2

Sass Install the loaders to preprocess the Sass files. SASS Loader compiles Sass to CSS, also requires node-sass. npm install --save-dev sass-loader node-sass PostCSS Loader processes CSS with PostCSS. npm install --save-dev postcss-loader CSS Loader resolves import at-rules and url functions in the CSS. npm install --save-dev css-loader Style Loader inlines <style></style> in the DOM. npm install --save-dev style-loader URL Loader and Resolve URL Loader handle relative paths.
Post

Webpack 3 Sass cssnano Autoprefixer Workflow II

This follow up to the basic Webpack 3 Sass preprocessor workflow I wrote about here includes how to handle processing of relative URLs in the Sass for things like fonts and images. Ken Wheeler’s popular Slick carousel contains these asset types in its Sass, so let’s use that for this exercise. Getting Started Prerequisite: Node.js with npm. Navigate to the project root in your CLI, such as Terminal, Cygwin or PowerShell.
Post

Slick Lazy Load Photo Grid Using Webpack 3

How to layout and lazy load images in a flexible grid similar to how facebook displays them in a post. Selected images open a lightbox for previewing within a carousel. Image alt text is converted into a caption below the image. YouTube Video Features Lazy image loading ES6 transpiler JavaScript source maps Sass CSS preprocessor PostCSS Autoprefixer CSSnano Webpack 3 Demo Source Code Getting Started If you don’t already have Node.
Post

Webpack 3 Sass cssnano Autoprefixer Workflow

Basic Webpack 3 Sass preprocessor workflow using cssnano for postprocessing minification and optimization. The Autoprefixer PostCSS plugin is also included in this configuration to automatically add vendor prefixes for only the browsers that need to be supported. Before getting started, install Node.js and NPM. The default package manager for the Node.js JavaScript runtime environment, NPM is included with the Node.js installation. Project Navigate to the project root in your CLI, such as Terminal in OS X, PowersShell in Windows.
Post

Drupal 8 Custom Block Module Dev

For those ready to move beyond a simple “Hello World” module, this post documents building a Drupal 8 module with a Giphy search form in a custom block. The form uses jQuery to request data from the Giphy API and display the results. Drupal 8 module to demonstrate custom block creation with the following features: configuration data that is passed into the modules js library public API search using core jQuery functions twig template for a front end Giphy search form Source Code Module Folder To get started, create a folder for the module in either /modules/custom/ or /sites/all/modules/.
Post

WordPress Post from Front End using REST API and Vue.js Part II

The objective of this post is to demonstrate some Vue.js basics for working with the WordPress REST API. This post continues where the last post left off with the following additions. List posts submitted by the current user Select from the list to edit a post Delete a post from the list Source Code Development The original proof of concept details building the WordPress plugin, installing Vue.
Post

WordPress Post from Front End using REST API and Vue.js

This post is a simple proof of concept for using the new WordPress REST API to submit a new post draft from the front end. The form and user inputs are built using the Vue.js framework and vue-cli to create a simple Webpack build configuration. Demo on YouTube Environment This example was created using a fresh install of WordPress 4.7 served by XAMMP on Windows 10.
Post

WordPress Post from Front End using REST API and Vue.js - Page 2

Webpack Vue.js CLI Use vue-cli to download vuejs, webpack and template dependencies and create the project in the root of our plugin folder. Navigate to the wp-content/plugins directory. Update or install globally as needed. # update npm update -g vue-cli # or install npm install -g vue-cli Change to the wordpress plugins directory and use vue-cli to install the webpack-simple template into the new wp-api-vuejs-poc folder. For example,
Post

Laravel JWT Auth with Vue.js 2

This post is a refresh of Laravel JWT Auth with Vue.js I posted in September that applies to the 1.x version of Vue.js. Evan You released vue.js version 2 shortly thereafter and this post will cover building the Laravel JSON Web Token based authentication with it. February 11, 2017 – A lot has changed in the last 4 months with Vue.js and Webpack. Since Vue.js 2.1.x and Webpack 2.
Post

Laravel JWT Auth with Vue.js 2 - Page 2

Vue Resource In order to post the Registration form data, the Vue.js resource plugin needs to be installed. npm i vue-resource --save-dev Update resources/js/app.js to import the vue-resource plugin after the vue-router. Add the Vue.use statement for the vue-resource. Add the Vue.http.headers and Vue.http.options.root url. Laravel VerifyCsrfToken middleware will check for the X-CSRF-TOKEN request header. To make this token available to the client side script, it is being stored in the csrf-token meta tag near the top of the web page.
Post

Laravel JWT Auth with Vue.js 2 - Page 3

Sign in Form Add the following code to the Signin.vue file. Signin.vue <template> <div> <div class="alert alert-danger" v-if="error"> <p>There was an error, unable to sign in with those credentials.</p> </div> <form autocomplete="off" v-on:submit="signin"> <div class="form-group"> <label for="email">E-mail</label> <input type="email" id="email" class="form-control" placeholder="gavin.belson@hooli.com" v-model="email" required> </div> <div class="form-group"> <label for="password">Password</label> <input type="password" id="password" class="form-control" v-model="password" required> </div> <button type="submit" class="btn btn-default">Sign in</button> </form> </div> </template> <script> import auth from '.
Post

Laravel JWT Auth with Vue.js

This post documents using Laravel to build JSON Web Token based authentication with a Vue.js 1.0 user interface. UPDATE: vue.js 2.0 version published. A fresh install of Laravel 5.2 for local development is required. Head over to the Laravel 5.2 docs to get setup with Composer and Laravel as needed. This post contains some info on how I installed Laravel 5.2 on Windows. Once Laravel 5.2 is installed, the database created and the .
Post

Laravel JWT Auth with Vue.js - Page 2

API For form validation, create a FormRequest class. Use the command line and the php artisan make command to generate the class as follows. php artisan make:request RegisterFormRequest Edit app/Http/Requests/RegisterFormRequest.php. First, return true instead of false in the authorize function since using JWT for that. Then add the validation rules in the array that is returned in the rules function for the new User as follows. RegisterFormRequest.php public function authorize() { return true; } .
Post

Handlebars Templates with Browserify

This post documents how to use the hbsfy precompiler plugin for Browserify to compile Handlebars templates into javascript. With this design, templates can be required as javascript modules in the views that use them. Requirements Node.js which includes NPM. Browserify Gulp Command shell such as terminal, Cygwin or Bash on Ubuntu on Windows. Code Editor. Global Packages List the global packages that are installed with the npm list –global command.
Post

Laravel User Registration with Email Activation

This post documents how to add an e-mail confirmation to the Laravel User registration that is generated by the Artisan console. In this example, the registered user will not be able to login until the activation link that is sent to the users registered e-mail account has been loaded into the browser. Requirements An instance of Laravel 5.2 setup for local development with authentication scaffolding is required. Refer to the first page of my recent post on Laravel User Authentication with Ajax Validation for more information on installing Laravel 5.
Post

Laravel User Authentication with Ajax Validation

This post documents how to add Ajax form validation to Laravel User Authentication that is generated by the Artisan console. Requirements An instance of Laravel 5.2 setup for local development is required. Head over to the Laravel 5.2 docs to get setup as needed. For my setup on Windows 10, I am using XAMPP 5.6.12 which meets all of the requirements. Note that your document root will need to be the laravel/public directory.
Post

Google Maps API with Browserify

This post documents how to use local JavaScript modules with Browserify and the Google Maps JavaScript API. In this example, the Google Map contains a marker that can be dragged to reset the browser form with the marker position location data. Additionally, Browserify shim is used to require jQuery since it is already being loaded from a CDN. Requirements Node.js which includes NPM. Browserify Gulp Command shell such as terminal, Cygwin or Windows Command prompt.
Post

Xdebug for XAMPP on OS X

After discovering how nice the vscode-php-debug extension works in Visual Studio Code on my Windows 10 laptop, I wanted this same setup for a PHP project on my work Mac Book Pro running OS X Yosemite (10.10). The version of XAMPP I currently have installed on the Mac is 5.6.11-0 and for this tutorial, there are a few requirements to consider… Requirements Command Line Tools for Xcode
Joomla

Customizing Media Manager

These examples show how to load copies of com_media views and templates instead of their core counterparts for customization without hacking any core Joomla files. Here is the secret sauce to override com_media views and templates. A system plugin with an onAfterInitialise() event handler to capture request data and evaluate parameters using JInput. For example, /plugins/system/mcm/mcm.php // no direct access defined ( '_JEXEC' ) or die ( 'Restricted access' ); jimport('joomla.
Post

Google Maps API RequireJS Module

This post documents how to create a RequireJS module that loads the Google Maps JavaScript API and is used by a web page to populate form inputs with location data. The Google Map contains a marker that can be dragged to reset the form with the marker position location data. Source Code Development Environment In order to use the package managers, Gulp task runner, BrowserSync and RequireJS optimizer, you will need to have the following installed.
Post

Joomla Hello World Module

This post documents my experience while following the Creating a simple module Joomla 3.x tutorial. I am brand new to Joomla and wanted to share my experience for anyone else trying to develop, install and demo this module in their Joomla 3 environment. After following the steps in the tutorial, you can compare your mod_helloworld files to the files I have pushed to github. Additionally, here is the file structure of the module.
Post

Wordpress Page Specific Styles or Scripts

I wanted an efficient way to load page or post specific stylesheets and or scripts which lead me to see if I could utilize custom fields for this. Using custom fields combined with wp_enqueue_style and wp_enqueue_script worked perfectly. This solution allows me to link css or javascript files for only the posts or pages I want. 1. Add a couple of custom fields, one for styles and one for scripts to a page using the editor:
Post

Browserify with Sourcemaps

Browserify lets you write modular JavaScript in node.js style. At the beginning of each module you write, the respective dependencies are added using require statements. Then Browserify compiles the modules along with all of the dependencies into an optimized JavaScript file for use in the browser. If jQuery has already been loaded by a CDN or otherwise, a Browserify Shim can be used to include global jQuery as a module.
Post

Visual Studio MVC Bourbon Web App

It is now 2015 and with it a new version of Visual Studio that includes tools for Bower front end package management, Node Package Manager (NPM) and the Grunt JavaScript Task Runner. Not surprisingly, Microsoft has its own way of implementing Grunt, Bower and Node Modules in their upcoming Visual Studio debut. You don’t have to wait for Visual Studio 2015. Grunt, Bower, Node Modules and Bourbon can easily be included in a Visual Studio 2012 MVC 4 web application.
Post

Bourbon

This post is not about a barrel-aged distilled spirit made primarily from corn. Instead, it is about a Sass mixin library. To add Bourbon to your web project, visit the Bourbon GitHub repo and take a look at the requirements. The first requirement is obviously Sass, since this is a mixin library for it. As of this post, the latest Bourbon requires Sass 3.3+. To install or update Sass you will need to have Ruby installed.
Post

XAMPP Windows Setup

Documenting my XAMPP for Windows setup for myself and anyone else who finds it useful. For those of you that do not know, XAMPP is a completely free, easy to install Apache distribution containing MySQL, PHP, and Perl. I still have my Virtual Machine for LAMP Development which I will use for test deployments of my localhost LAMP development prior to production deployment. This local XAMPP setup will be better for debugging, working with node modules and grunt tasks for preparing the deployment build.
Post

Bootstrap Customization

This tutorial covers using Git to clone, branch and merge the latest Bootstrap source code, modifying and compiling your modifications to the source LESS variables using Grunt and viewing your compiled changes with a local Node.js web server. If you are not familiar with Git, Node.js and Grunt, please read my previous post, Grunt JavaScript Task Runner to help get you started. You could just use the Bootstrap customize and download form to customize the LESS variables and download a pre-compiled Bootstrap package.
Post

Grunt JavaScript Task Runner

This tutorial describes how to setup and use the Grunt JavaScript task runner to automate repetitive tasks such as minification and compilation. Grunt is installed using npm, the Node.js package manager. You will also need Git to work with the tagged source code. This makes it easy to reset and compare your working copy of the code at each step. I discovered commit tags while using the AngularJS tutorial.
Post

Virtual Machine for LAMP Development

This blog post addresses a common scenario — a local LAMP development environment on your Windows or OS X computer. You could use XAMPP on either Windows or OS X, MAMP on OS X or native Apache in OS X. Here, we will create a Linux virtual machine with Samba configured to share the Virtual Machine file system with the host computer. We will also create virtual hosts, install and configure WordPress and Xdebug.
Post

AngularJS Cascaded Selects

As a follow up to jQuery Mobile Cascaded Selects using MVC4 and KnockoutJs, I have created this AngularJS Cascaded Selects tutorial that gets it’s data from the Chinook Web API Project. The application uses angular data-binding and the ngOptions attribute to dynamically generate a list of option elements for each of the three HTML select elements. index.html <!DOCTYPE HTML> <html ng-app="ChinookApp"> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script> <script src="libs/angular-resource.min.js"></script> <script src="app.
Post

DNN Windows Client

This tutorial will walk you through the creation of a basic Windows Forms application to test remote authentication and authorization when communicating with a DNN CMS web portal using its web services framework / Web API. This is for development and educational purposes only running locally. You will at least want to make sure that you have SSL enabled for your DNN Web Services in a real world scenario.
Post

Mint LAMP Development Environment - Part Two

Linux Mint 15 ‘Olivia’ I decided it was time to ditch my Linux 13 KDE setup and try the improved MATE 1.6 desktop now that Linux Mint 15 released. I find it pretty slick and fast, a nice change from Windows when I decide to do some development in a true LAMP environment. Speaking of which, we need to get that installed. Before doing that, the first thing I like to do is open up a terminal and run:
Post

DNN Session Timer with AngularJS

This tutorial will guide you through the steps necessary to add a session timeout timer and alert dialog within a DotNetNuke (DNN) Module using AngularJS. Key concepts: Using DNN server objects to create AngularJS client-side objects; Using DNN jQuery and jQuery UI registration; Using DNN Client Resource Management; Using DNN Form Patterns Requirements: DotNetNuke 7; AngularJS; An understanding of how to develop and install DotNetNuke modules.
Post

DotNetNuke 7 Web Services Framework Web API Routes

When building the DotNetNuke Web Services API controllers, I want to use this REST convention for the endpoints to access a resource such as the Chinook database. Note: My DotNetNuke website is running under IIS 7.5 with “dnn7” as the host name binding. Only the request method, url, protocol, content-type and content-body are included in request examples below. Return all Tracks: GET http://dnn7/DesktopModules/Services/API/Tracks HTTP/1.1 Return a Track where ID = 1:
Post

Chinook Web API Project

For this project, you will need to have access to the Chinook SQL Server Database. Visual Studio Express 2012 for Windows 8 SQL Server 2012 Express Management Studio 1. Create a New Project New ASP.NET MVC 4 Web Application - ChinookWebApi 2. Select the Web API Project Template New ASP.NET MVC 4 Project - Web API Project Template Data Models In Solution Explorer, right-click the Models folder and select Add > New Item (Ctrl+Shift+A) > Select Class and save it as Tracks.
Post

Magento Development Environment

Requirements Magento Apache, MySQL & PHP - for more info, read Mint LAMP Development Environment Requirements Test Does your server meet the requirements for Magento? Install Sample Data Before installing Magento, download and install sample data and media. Using phpMyAdmin, import the sample data sql file “magento_sample_data_for_1.6.0.0.sql” into an empty magento database. Copy the contents of the sample “media” folder into the media folder of your Magento installation.
Post

Mint LAMP Development Environment

OPERATING SYSTEM: Linux Mint 13 Maya For Drupal development, since I already have a Linux Mint system setup, I decide to focus on it rather than the Windows 8 Acquia Drupal setup I blogged about a few days ago. Apache, MySQL & PHP Install all of these applications with a single command. Thanks to Unix System Engineer, Nitin Sookun for posting this on the Linux Mint Community website. Since you will need root permissions when performing write operations outisde of your home directory, the commands shown below presume that you are logged in as root or are in a root instance of the terminal.
Post

Acquia Drupal for Windows

I needed to setup a localhost Drupal development environment to upgrade a Drupal 6 theme and do some testing prior to upgrading a live site to Drupal 7. I decided to give the Microsoft Web Platform Installer a try on my Windows 8 computer. While installing Acquia Drupal with Web Platform Installer 4.0, at some point the Web Platform Installer asks for MySQL ‘root’ user password. Further along during the install, I received an error and was prompted again for the MySQL ‘root’ password.
Post

jQuery Mobile Cascaded Selects using MVC4 and KnockoutJs

This post documents building cascading select inputs using jQuery and Knockout for the user interface and MVC4 to serve the content. Step 1 OPEN or CREATE the MvcMobileApp that includes the Chinook Models and Data Access class [chinook-asp-net-mvc-4-web-application] View CREATE a view that will be used to render the cascading selects to the browser. In the Solution Explorer, right click on the Views folder and create a new folder names Chinook.
Post

Chinook ASP.NET MVC 4 Web Application

For this tutorial, you will need: Visual Studio Express 2012 for Windows 8 download details SQL Server Express Database using Visual Studio 2012 with SQL Server Express in this tutorial. Other versions may work (untested). msdn.microsoft.com Chinook database github.com/jimfrenette/chinookdatabase SQL Server 2012 Express Management Studio download details In Visual Studio, create a new C# ASP.NET MVC 4 Web Application: Next, select the Mobile Application Project Template. This template includes jQuery, jQuery intellisense for Visual Studio, jQuery Mobile and Knockoutjs javascript files.
Post

Chinook SQL Server Database

The Chinook Database is a sample database available for SQL Server, Oracle, MySQL, PostgreSQL, SQL Server Compact, SQLite and more. It is ideal for demos, application prototypes and perhaps even a digital media store application. It includes tables for artists, albums, media tracks, invoices and customers. Download and Installation Download the Chinook database from GitHub. Chinook Database Make sure you can Access your SQL Server [Configure Windows Firewall]
Post

DotNetNuke Modal PopUps

Task 1, create a jQuery UI dialog to confirm a postback action invoked by a ASP.NET button control. In your module’s ascx file, add a button control and a div to contain you dialog. <asp:Button ID="btnDelete" runat="server" AutoPostBack="false" ButtonType="LinkButton" CssClass="main_button" OnClick="btnDelete_Click" Text="Delete" UseSubmitBehavior="false"> </asp:Button> <div id="dlgDeleteConfirm" title="Confirm"> <div class="confirmDialog">Are you sure you want to delete this?</div> </div> In you ascx code behind, create a method to create a client script block, you call can call on page load.
Post

Random full page background

This Tutorial is written with Drupal 7 in mind. However, it can be applied to any website. While upgrading and redesigning thebga.org golf association website, I decided to figure out how to have a random full page background part of the design. Drupal 7 makes it easy to include js and keep it, the theme and templates all separate from the Drupal core. The key is separation of your theme and it’s modules from the Drupal core and it’s modules.
Post

Improved Font Rendering in Fedora 15 / Gnome 3

Checkout this blog article at infinality.net: Subpixel Hinting and Other Enhancements for Freetype & Fedora 15 RPM Packages Per the infinality article, install the infinality-settings package Edit /etc/X11/.Xresources to read: Xft.autohint: 0 Xft.lcdfilter: lcddefault Xft.hintstyle: hintfull Xft.hinting: 1 Xft.antialias: 1 Xft.dpi: 96 Xft.rgba: rgb Install Windows fonts. To do this, I copied all the .ttf fonts from my mounted Windows 7 device (/mnt/ntfs/Windows/Fonts) to /usr/share/fonts.
Post

jQuery - MSSQL Pagination and Data Templates

Here is a tutorial to show you how to paginate JSON data in the client using jQuery, jQuery Templates plugin, ASP.NET and SQL Server. For this tutorial, you will need: jQuery version 1.4.2 or greater [jquery.com] jQuery Pager plugin [github.com/jonpauldavies/jquery-pager-plugin] jQuery Templates plugin [github.com/jquery/jquery-tmpl] Visual Studio and SQL Server [msdn.microsoft.com] using Visual Studio 2010 with SQL Server Express in this tutorial. other versions may work (untested). Chinook database [github.