Monday, August 8, 2011

Drush Instalation on Windows

Video Tutorial: http://vimeo.com/15371661
Other helpful Link: http://ninjagirl.com/posts/013/installing-drush-windows


------

Words in my experience - it woks well  :-)


Step1: Install Wamp server on your system

Step2:
Download DRUSh from this website for full package - http://www.7-zip.org/
OR (click on below link for your choice)
-----------------------------------------------------------------------
Download 7-Zip 9.20 (2010-11-18) for Windows:
Link
Type
Windows
Size
.exe
32-bit x86
1 MB
.msi
64-bit x64
1 MB
-----------------------------------------------------------------------
Place this folder on c drive or somewhere…
Step3:
Download and install all additional applications - Wget, Tar, LibArchive and Gzip from  this website http://gnuwin32.sourceforge.net/packages.html

Step4: In this step you have to take paths like shown in the below.
Go to C:\wamp\bin ->
C:\wamp\bin\php\php5.2.5
C:\wamp\bin\mysql\mysql5.0.45
C:\wamp\bin\apache\apache2.2.6
And Drush location path
C:\drush


Step5:
Copy all above paths and past on
  System PropertiesEnvironment Variables
Edit Path System Variable

Like this: %SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;C:\wamp\bin\php\php5.2.5;C:\wamp\bin\mysql\mysql5.0.45;C:\wamp\bin\apache\apache2.2.6;And Drush location path;C:\drush;

Step6: type drush command on CMD – You will get all drush commands – So it is ready to work with drush

Thursday, August 4, 2011

Font embedding with css: the @font-face selector ... and more


Option One:
/* first for IE 4–8 */
@font-face {
  font-family:Covered By Your Grace;
  src: url("CoveredByYourGrace.ttf");
}

/* then for WOFF-capable browsers */
@font-face {
  font-family:Covered By Your Grace;
  src: url("CoveredByYourGrace.ttf") format("truetype");
}

Option Two:
@font-face {
   font-family: 'Covered By Your Grace'; /* Font file name that you can find on photoshop */
   src: url('coveredbyyourgrace-webfont.eot');
   src: url('coveredbyyourgrace-webfont.eot?#iefix') format('embedded-opentype'),
        url('coveredbyyourgrace-webfont.woff') format('woff'),
        url('coveredbyyourgrace-webfont.ttf') format('truetype'),
        url('coveredbyyourgrace-webfont.svg#CoveredByYourGraceRegular') format('svg');
   font-weight: normal;
   font-style: normal;
}

Font Converter:
If you have any file font just upload it on below website and get a web font kit with tiff, eot and woff
http://www.fontsquirrel.com/fontface/generator

Tuesday, August 2, 2011

Font Replacement Using Cufón

We all know about the big font replacement methods. sIFR's big. Image font replacement has gained some steam. Not too many people know about a great project named Cufón though. Cufón uses a unique blend of a proprietary font generator tool and JavaScript to create a custom font renderer in canvas and VML. Here's how to use Cufón to render the Sin City font for your headers.

Step 1: Generate the Font

The first step is to use the Cufón font-generator tool to convert and customize the way the font renders. I was very impressed with the number of options available for the font conversion. Once the conversion is done, Cufón's generate presents you with a JavaScript file containing the font information as Cufón can read it.

Step 2: Include Cufón and the Font

Include the Cufón JavaScript file and the generated font's JavaScript file.
copy<script type="text/javascript" src="cufon.js"></script>
<script type="text/javascript" src="Sin_City_400.font.js"></script>

Step 3: Selectors and Elements

Time to select the elements to Cufón-ize. I don't recommend using Cufón for every bit of language on the page -- doing so can be resource-intensive. Generally you want to use custom fonts in headings so that's what I've chosen to do below.
copyCufon.replace('#cufon-area h1, #cufon-area h2, #cufon-area h3');
In my experience, Cufón looks better than both sIFR and image methods. Be sure to check out Cufón as it's an outstanding tool and I look forward to seeing where the project goes. What are your thoughts?

---------------------------------
Example
---------------------------------
<script type="text/javascript" src="/xyz/sites/all/themes/paydayok_theme/js/cufon-yui.js"></script>
<script src="/safeloans/safeloans/sites/all/themes/paydayok_theme/js/cufon-replace.js" type="text/javascript"></script>
<script type="text/javascript" src="/xyz/sites/all/themes/paydayok_theme/js/Covered_By_Your_Grace_400.font.js"></script>
---------------------------------------------
cufon-replace.js
---------------------------------------------
Cufon.replace('h1, .view-testimonial-block_1, #cufon-area h3');
Cufon.replace('h1, h1#page-title', { fontFamily: 'Covered By Your Grace' });
Cufon.replace('h1 span,#news label', { fontFamily: 'Covered By Your Grace' });
Cufon.replace('ul.starlist li a,#content a.more,#news .button,.gallery, #header .nav a', { fontFamily: 'Covered By Your Grace',hover:true});