Goksel Eryigit - Front-end Developer http://geryit.com/blog Just another WordPress weblog Tue, 17 Aug 2010 12:52:25 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Building Custom WordPress Theme http://geryit.com/blog/2010/08/building-custom-wordpress-theme/ http://geryit.com/blog/2010/08/building-custom-wordpress-theme/#comments Sun, 15 Aug 2010 10:52:00 +0000 admin http://geryit.com/blog/?p=512 You want to build your own WordPress theme but in a very simple way, then you dont need to edit the default wordpress theme, just create a new one with just 5 files. That is why I will share a simple version of the theme I used on skalenius.com

index.php(main stuff)

<!DOCTYPE html>
<html lang="en">
	<!-- BEGIN HEAD-->
        <!-- You probably will not change anything here.  May be you call more css or js files -->
        <head>
            <meta http-equiv="content-type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
            <title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>
            <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/reset.css" />
            <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/custom.css" />
            <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/style.css" />
            <?php wp_head();?>
        </head>
    <!-- END HEAD-->

    <body>
        <div class="blog container_16">

        	<!-- BEGIN HEADER-->
                <header class="grid_16">
                    <h1 class="grid_12 alpha"><a href="<?php bloginfo('url');?>" class="logo ti">Sofie Kalenius</a></h1>
                    <aside class="grid_4 omega">
                        <form id="searchForm" method="get" action="<?php bloginfo('url');?>"><input type="text" name="s" value="Search..." /><input type="submit" value="Submit"/></form>
                    </aside>
                    <ul>
                        <?php  wp_list_categories('title_li='); ?>
                    </ul>
                </header>
            <!-- BEGIN HEADER-->

            <!-- BEGIN MAIN CONTENT-->
                <div class="main grid_16">
                    <section class="posts grid_13 alpha">

                        <?php if (have_posts()) : ?>
                            <?php while (have_posts()) : the_post();?>
                                <div class="post">
                                    <div class="date grid_2 alpha"><section><p class="top"><?php the_time('d') ?></p><p class="bottom"><?php the_time('M') ?> <?php the_time('y') ?></p></section></div>
                                    <div class="content grid_11 omega spacing80">
                                        <a href="<? the_permalink() ?>#comments" class="comment_no"><?php comments_number('0','1','%'); ?></a>
                                        <h2><a href="<? the_permalink() ?>" rel="bookmark" class="title"><? the_title();?></a></h2>
                                        <? if(has_tag()){?><div class="tags"><?php the_tags('Tags: ', ', '); ?></div><? }?>
                                        <article><?php the_content('Read the rest of this entry &raquo;'); ?></article>
                                    </div>

                                <?php comments_template();?>
                                </div>
                            <?php endwhile; else: ?>
                            <p>Sorry, no posts matched your criteria</p>
                        <?php endif; ?>

                        <nav class="grid_11 prefix_2 alpha omega"><section><?php next_posts_link('&laquo; Older Posts') ?>&nbsp;</section><section>&nbsp;<?php previous_posts_link('Newer Posts &raquo;') ?></section></nav>
                    </section>
                    <aside class="sidebar grid_3 omega">

                        <ul>
                            <?php
                                if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
                            <?php endif; ?>
                        </ul>

                    </aside>
                </div>
            <!-- END MAIN CONTENT-->

        </div>

        <!-- BEGIN FOOTER-->
            <footer class="footer">
                <div class="container_16">
                    <ul><?php  wp_list_categories('title_li='); ?></ul>
                </div>

                <?php wp_footer(); ?>
            </footer>
        <!-- END FOOTER-->
    </body>
</html>

style.css

body{font-family:Arial, Helvetica, sans-serif;background:#f6f5f5 url(images/body_bg.png) repeat-x center top;font-size:12px;}
input,select,textarea{font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#8f8e90;}
input{float:left;padding:5px;width:50%;font-size:18px;color:#666;}
input[type=submit]{background:#1e7972;color:#fff;border:none;width:auto;padding:5px 40px;}
textarea{float:left;padding:5px;width:80%;font-size:18px;color:#666;}
header,footer,nav,section,article,aside,details,div,ul,li,p,a,img,label,form{display:block;position:relative;float:left;}
h1,h2,h3,h4,h5,h6,p,ul,form{padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;font-weight:normal;line-height:normal;float:left;width:100%;clear:both;}
h3{font-size:22px;color:#424242;font-weight:bold;}
ul{list-style:none;}
a{text-decoration:none;color:#424242;}
a:hover{color:#999}

.blog{float:none;padding-bottom:30px;overflow:hidden;visibility:hidden;}
.blog>header{width:100%;padding-top:27px;}
.blog>header>h1>a{width:479px;height:65px;background:url(images/logo.png);margin-top:33px;}
.blog>header>h1>a:hover{background-position:bottom;}
.blog>header>aside{height:94px;background:url(images/search_and_networks_bg.png) right top;}
.blog>header>aside>form{width:100%;}
.blog>header>aside>form>input[type=text]{width:162px;height:19px;border:2px solid #e3e2e2;background:#e9e9e9;padding:5px;padding-right:45px;}
.blog>header>aside>form>input[type=submit]{position:absolute;width:40px;height:33px;background:url(images/search_submit.png);top:0px;left:174px;cursor:pointer;background-color:none;border:0;padding:0;}
.blog>header>aside>form>input[type=submit]:hover{background-position:bottom;}
.blog>header>aside>div{width:100%;margin-top:24px;}
.blog>header>aside>div>a{width:38px;height:38px;background:url(images/networks.png);margin-left:7px;}
.blog>header>aside>div>a:first-child{margin-left:0;}
.blog>header>aside>div>a.nw1{background-position:0px top;}
.blog>header>aside>div>a.nw1:hover{background-position:0px bottom;}
.blog>header>aside>div>a.nw2{background-position:-47px top;}
.blog>header>aside>div>a.nw2:hover{background-position:-47px bottom;}
.blog>header>aside>div>a.nw3{background-position:-93px top;}
.blog>header>aside>div>a.nw3:hover{background-position:-93px bottom;}
.blog>header>aside>div>a.nw4{background-position:-138px top;}
.blog>header>aside>div>a.nw4:hover{background-position:-138px bottom;}
.blog>header>aside>div>a.nw5{background-position:-182px top;}
.blog>header>aside>div>a.nw5:hover{background-position:-182px bottom;}
.blog>header>ul{width:100%;margin-top:50px;padding:10px 0;border-top:1px solid #e9e8e8;border-bottom:1px solid #e9e8e8;}
.blog>header>ul>li{}
.blog>header>ul>li>a{height:25px;line-height:25px;font-size:15px;color:#424242;padding:0 10px;}
.blog>header>ul>li>a.on{background:#424242;color:#f6f5f5;font-weight:bold;}
.blog>header>ul>li>a:hover{background:#424242;color:#f6f5f5;}
.blog>.main{width:100%;padding-top:30px;}
.blog>.main>.posts{}
.blog>.main>.posts>.post{width:100%;margin-bottom:30px;color:#424242;}
.blog>.main>.posts>.post>.date{}
.blog>.main>.posts>.post a{display:inline;float:none;}
.blog>.main>.posts>.post img{display:inline;}
.blog>.main>.posts>.post .wp-smiley{border:0!important;margin:0!important;}
.blog>.main>.posts>.post>.date>section{width:80px;height:81px;background:url(images/bgitem1.png);color:#f6f5f5;}
.blog>.main>.posts>.post>.date>section>.top{margin-top:5px;text-align:center;font-size:42px;}
.blog>.main>.posts>.post>.date>section>.bottom{margin-top:0px;text-align:center;font-size:13px;}
.blog>.main>.posts>.post>.content{background:#eaebeb url(images/bgitem2.png) no-repeat right top;padding:20px 40px 40px;}
.blog>.main>.posts>.post>.content>a.comment_no{width:40px;height:70px;float:right;margin:-18px -38px 0 0;font-size:15px;color:#f6f5f5;text-align:center;line-height:55px;padding-left:25px;}
.blog>.main>.posts>.post>.content>a.comment_no:hover{color:#000;}
.blog>.main>.posts>.post>.content>h2{margin-top:-40px;}
.blog>.main>.posts>.post>.content>h2>a.title{font-size:28px;color:#424242;font-weight:bold;}
.blog>.main>.posts>.post>.content>h2>a.title:hover{color:#999;}
.blog>.main>.posts>.post>.content>.tags{width:100%;color:#424242;font-size:12px;margin-top:3px;}
.blog>.main>.posts>.post>.content>.tags>span{font-weight:bold;}
.blog>.main>.posts>.post>.content>.tags>a{display:inline;float:none;color:#424242;}
.blog>.main>.posts>.post>.content>.tags>a:hover{color:#999;}
.blog>.main>.posts>.post>.content>article{width:100%;}
.blog>.main>.posts>.post>.content>article>p{margin-top:20px;width:auto;float:none;clear:none;}
.blog>.main>.posts>.post>.content>article>p>a{display:inline;width:auto;float:none;clear:none;}
.blog>.main>.posts>.post>.content>article>p img{border:5px solid #999;margin:0 15px 10px 0;padding:0;}
.blog>.main>.posts>nav{}
.blog>.main>.posts>nav>section{width:50%;}
.blog>.main>.posts>nav>section>a{font-size:22px;color:#424242;text-decoration:underline;}
.blog>.main>.posts>nav>section>a:hover{color:#999;}
.blog>.main>.sidebar{}
.blog>.main>.sidebar>ul{width:100%;}
.blog>.main>.sidebar>ul>li{width:100%;margin-bottom:30px}
.blog>.main>.sidebar>ul>li>h3{font-size:20px;color:#424242;background:url(images/bar1.png) repeat-x bottom;padding-bottom:5px;margin-bottom:5px;}
.blog>.main>.sidebar>ul>li>ul{width:100%;}
.blog>.main>.sidebar>ul>li>ul>li{width:100%;padding:5px 0;}
.blog>.main>.sidebar>ul>li>ul>li>a{font-size:11px;color:#424242;background:url(images/bull1.png) no-repeat left center;text-indent:7px;}
.blog>.main>.sidebar>ul>li>ul>li>a:hover{color:#999;}
.blog>.main>.sidebar>ul>li>ul>li>p{font-size:10px;}
.blog>.main>.sidebar>ul>.featured>ul>li{width:100%;border-bottom:1px solid #eee;padding:10px 0;}
.blog>.main>.sidebar>ul>.featured>ul>li>.right>h4>a{font-size:13px;font-weight:bold;background:none;text-indent:0;}
.blog>.main>.sidebar>ul>.featured>ul>li>.right>h4>a:hover{color:#999;}
.blog>.main>.sidebar img{padding:2px;}

.blog>.main>.posts>.post>.comments{margin-top:30px;background:#eaebeb;padding:20px 40px 40px;}
.blog>.main>.posts>.post>.comments>.navigation{width:100%;margin-top:10px;}
.blog>.main>.posts>.post>.comments>ul{width:100%;margin-top:10px;}
.blog>.main>.posts>.post>.comments>ul>li{width:100%;margin-top:10px;}
.blog>.main>.posts>.post>.comments>ul>li a{float:none;display:inline;clear:none;}
.blog>.main>.posts>.post>.comments>ul>li>div{width:100%;color:#666;}
.blog>.main>.posts>.post>.comments>ul>li>div>img{padding:0 5px 5px 0;}
.blog>.main>.posts>.post>.comments>ul>li>div>.date{font-size:9px;}
.blog>.main>.posts>.post>.comments>ul>li>div>.comment_text{font-size:11px;color:#000;}
.blog>.main>.posts>.post>.comments>#respond{width:100%;margin-top:20px;}
.blog>.main>.posts>.post>.comments>#respond #commentform p{margin-top:10px;}
.blog>.main>.posts>.post>.comments>#respond #commentform label{margin:10px 0 0 10px;}
.footer{width:100%;height:100px;background:#1e7972 url(images/footer_bg.png) repeat-x;}
.footer>div{float:none;margin-top:30px;color:#133c39;}
.footer>div>a{float:none;display:inline;color:#133c39;font-size:12px;text-decoration:underline;}
.footer>div>a:hover{color:#000;}
.footer>div>.copyright{margin-top:5px;color:#fff;}
.footer>div>.copyright a{float:none;display:inline;color:#CFCFCF;}
.footer>div>.copyright a:hover{color:#333;}

.ti{text-indent:-99999px;}
.tar{text-align:right;}
.fr{float:right;}
.vv{visibility:visible!important;}
p img {padding: 0;max-width: 100%;float:none;}
img.centered {display: block;margin-left: auto;margin-right: auto;}
img.alignright {padding: 4px;margin: 0 0 2px 7px;display: inline;}
img.alignleft {padding: 4px;margin: 0 7px 2px 0;display: inline;}
.alignright {float: right;}
.alignleft {float: left;}
.wpcf7{width:100%;padding-top:30px!important;}
.wpcf7 p{padding-top:10px!important;}

comments.php(customize comment form)

<?php

// Do not delete these lines
	if (!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME']))
		die ('Please do not load this page directly. Thanks!');

	if ( post_password_required() ) { ?>
		<p class="nocomments">This post is password protected. Enter the password to view comments.</p>
	<?php
		return;
	}
?>

<div class="comments push_2 grid_11 alpha spacing80">
<!-- You can start editing here. -->

<?php if ( have_comments()) : ?>
	<h3 id="comments"><?php comments_number('No Responses', 'One Response', '% Responses' );?> to &#8220;<?php the_title(); ?>&#8221;</h3>

	<div class="navigation">
		<div class="alignleft"><?php previous_comments_link() ?></div>
		<div class="alignright"><?php next_comments_link() ?></div>
	</div>

	<ul>
		<?php wp_list_comments('callback=custom_comment_template'); ?>
	</ul>

 <?php else : // this is displayed if there are no comments so far ?>

	<?php if ( comments_open() ) : ?>
		<!-- If comments are open, but there are no comments. -->

	 <?php else : // comments are closed ?>
		<!-- If comments are closed. -->
		<p class="nocomments">Comments are closed.</p>

	<?php endif; ?>
<?php endif; ?>

<?php if ( comments_open() ) : ?>

<div id="respond">

<h3><?php comment_form_title( 'Leave a Reply', 'Leave a Reply to %s' ); ?></h3>

<div class="cancel-comment-reply">
	<small><?php cancel_comment_reply_link(); ?></small>
</div>

<?php if ( get_option('comment_registration') && !is_user_logged_in() ) : ?>
<p>You must be <a href="<?php echo wp_login_url( get_permalink() ); ?>">logged in</a> to post a comment.</p>
<?php else : ?>

<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">

<?php if ( is_user_logged_in() ) : ?>

<p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo wp_logout_url(get_permalink()); ?>" title="Log out of this account">Log out &raquo;</a></p>

<?php else : ?>

<p><input type="text" name="author" id="author" value="<?php echo esc_attr($comment_author); ?>" size="22" tabindex="1" <?php if ($req) echo "aria-required='true'"; ?> />
<label for="author"><small>Name <?php if ($req) echo "(required)"; ?></small></label></p>

<p><input type="text" name="email" id="email" value="<?php echo esc_attr($comment_author_email); ?>" size="22" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?> />
<label for="email"><small>Mail (will not be published) <?php if ($req) echo "(required)"; ?></small></label></p>

<p><input type="text" name="url" id="url" value="<?php echo esc_attr($comment_author_url); ?>" size="22" tabindex="3" />
<label for="url"><small>Website</small></label></p>

<?php endif; ?>

<!--<p><small><strong>XHTML:</strong> You can use these tags: <code><?php echo allowed_tags(); ?></code></small></p>-->

<p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>

<p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
<?php comment_id_fields(); ?>
</p>
<?php do_action('comment_form', $post->ID); ?>

</form>

<?php endif; // If registration required and not logged in ?>
</div>
<?php endif; // if you delete this the sky will fall on your head ?>
</div>

functions.php(customize comments view)

<?
if(function_exists('register_sidebar'))
register_sidebar(array(
'before_widget' => '<li>',
'after_widget' => '</li>',
'before_title' => '<h3>',
'after_title' => '</h3>',
));

function custom_comment_template($comment, $args, $depth) {
	$GLOBALS['comment'] = $comment; ?>
	<li id="comment-<?php comment_ID(); ?>">
        <div><?php echo get_avatar($comment,$size='48'); ?><?php printf(__('<cite>%s</cite> <span>says:</span>'), get_comment_author_link()) ?><br /><span class="date"><?php printf(__('%1$s at %2$s'), get_comment_date(), get_comment_time()) ?></span><br /><span class="comment_text"><?=get_comment_text();?></span></div>
        <?php
}

require_once (TEMPLATEPATH . '/widgets.php');
?>

Click here for the entire theme files

]]> http://geryit.com/blog/2010/08/building-custom-wordpress-theme/feed/ 0 Custom Html5 Video Player with HD option http://geryit.com/blog/2010/07/custom-html5-video-player-with-hd-option/ http://geryit.com/blog/2010/07/custom-html5-video-player-with-hd-option/#comments Mon, 26 Jul 2010 22:09:52 +0000 admin http://geryit.com/blog/?p=499 I have been looking for an Html5 Player for mindwork3d project but could not find one with HD option. Finally I decided to add that by myself to my player.

First thing I did was to find a cool player skin. I found a vimeo skin on http://videojs.com/skins.html and downloaded zip version . Then added a custom css file for HD button on the player. Finally added javascript functions for HD property.

index.php

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="css/video-js.css"/>
<link rel="stylesheet" href="css/vim.css"/>
<link rel="stylesheet" href="css/hd.css"/>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/video.js"></script>
<script type="text/javascript" src="js/hd.js"></script>

<style type="text/css">
</style>
<title>video</title>
</head>

<body onLoad="ready();">

<div id="video_holder">Loading Video...</div>

</body>
</html>

hd.css

/*hd.css*/
.video-js-box{}
.video-js-box ul{float:none;}
.vjs-controls{padding-left:50px!important;padding-right:175px!important;}
.vjs-controls>li{font-size:10px!important;}
.vjs-controls>li>span{font-family:Georgia, "Times New Roman", Times, serif!important;}
.vjs-play-control{width:32px!important;height:32px!important;border-radius:0!important;-webkit-border-radius:0!important;-moz-border-radius:0!important;bottom:10px!important;}
.vjs-play-control:hover{background:#0066ff!important;}
.vjs-play span{border-top-width:7px!important;border-left-width:7px!important;border-bottom-width:7px!important;margin:9px 0 0 13px!important;}
.vjs-pause span{width:2px!important;height:14px!important;margin:9px 0 0 10px!important;}
.vjs-progress-control,.vjs-progress-holder,.vjs-play-progress,.vjs-load-progress,.vjs-fullscreen-control{border-radius:0!important;-webkit-border-radius:0!important;-moz-border-radius:0!important;}
.vjs-progress-holder{margin-right:10px!important;}
.vjs-progress-control .vjs-play-progress{background:#0066ff!important;}
.vjs-time-control{width:70px!important;right:105px!important;}
.vjs-volume-control{right:70px!important;width:35px!important;}
.vjs-volume-control ul{margin-left:0!important;}
.vjs-volume-control ul .vjs-volume-level-on{border-color:#0066ff!important;}
.vjs-fullscreen-control{width:20px!important;right:40px!important;padding:0 2px 0 8px!important;}
.vim-css .vjs-fullscreen-control:hover ul li:nth-child(3), .vim-css .vjs-fullscreen-control:hover ul li:nth-child(4), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(1), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(2){border-bottom-color:#0066ff!important;}
.vim-css .vjs-fullscreen-control:hover ul li:nth-child(1), .vim-css .vjs-fullscreen-control:hover ul li:nth-child(2), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(3), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(4){border-top-color:#0066ff!important;}
.vjs-hd-control{width:25px!important;right:10px;line-height:32px;padding-right:5px!important;font-size:11px!important;cursor:pointer!important;}
.vjs-hd-control span{display:block!important;width:20px!important;height:12px!important;float:left;color:#fff;margin-top:0px;font-weight:bold;font-size:14px;}
.vjs-hd-control span:hover{color:#0066ff;}
.vjs-hd-control .hd_on{color:#0066ff;}

hd.js

//hd.js
function ready(){
	load_showreel("sd");
}

function load_showreel(quality){
	$('#video_holder').html("Loading Video...");
	$('#video_holder').show();
	$.ajax({
		type: "POST",
		url: "video.php",
		data: "quality="+quality,
		success: function(msg){
			$('#video_holder').html(msg);
			VideoJS.setup();
			$(".vjs-controls").append('<li class="vjs-hd-control" title="Switch to High Definition"><span>HD</span></li>');

			var hd = $(".vjs-hd-control span");
			if(quality=="sd"){
				hd.removeClass("hd_on");hd.attr("title","Switch to Low Definition");
			}else{
				hd.addClass("hd_on");hd.attr("title","Switch to High Definition");
			}

			$(".vjs-hd-control").click(function(){pauseVideo();if(quality=="sd") load_showreel("hd"); else load_showreel("sd");});
			$(".vjs-fullscreen-control").attr("title","Fullscreen/Standart View");
			playVideo();
		}
	});
}

function playVideo(){
	v = document.getElementsByTagName('video')[0];
	v.play();
}

function pauseVideo(hide){
		v = document.getElementsByTagName('video')[0];
		v.src="";
		v.load();
		v.pause();
}

Here you will find the sample here .

Download the zip package here .

]]> http://geryit.com/blog/2010/07/custom-html5-video-player-with-hd-option/feed/ 2 Auto-Update SVN on DreamHost http://geryit.com/blog/2010/07/auto-update-svn-on-dream-host/ http://geryit.com/blog/2010/07/auto-update-svn-on-dream-host/#comments Wed, 07 Jul 2010 19:25:36 +0000 admin http://geryit.com/blog/?p=472 I have been using Media Temple Grid Hosting service for a long while and tried to setup my own svn repo settings there but I didnt go so far on using that. I want my online site to be updated on every commit but I understood that MT doesn’t let your site to be updated instantly. You can use cron jobs service but this service will let your web site to be updated in every 5 mins.

So the solution came up with DreamHost. You pay $10/month (Half of MT) and you will be able to update your site instantly and also you will realize that your site will be loaded faster.

Here are the steps to set your svn repo:

1. Get a DreamHost account.

2. Create a sub-domain for your SVN repo going here
My settings:
subdomain : svn.geryit.net

3. Create a domain or subdomain for your online web site going here again
My settings:
subdomain : mw.geryit.net

4. Create an SVN repo going here
My settings:
Project Name & Project ID :mindwork
Install to: svn.geryit.net/mindwork
Users : You should define one username and password at least

5. Create a cgi-bin folder in the remote directory and set CHMOD to 755 for this folder (On Cuteftp, right click to folder and select properties)
I created here : /home/geryit/mw.geryit.net/cgi-bin/

6. Use an ftp client and ssh to your server (I use cuteftp). If you dont have an ssh account go to here and add a new user (Dont forget to select “Shell” as Type of User Account)

7. Create an .htaccess file on desktop (windows will not let you put a “.” so just create “htaccess” file and rename the file using cuteftp)

8. Put the code below into your .htaccess

AuthName "Dialog prompt"
AuthType Basic
AuthUserFile /home/geryit/mw.geryit.net/cgi-bin/.htpasswd
Require valid-user

(Note that geryit is my root username and mw.geryit.net should be your online website)

9. Upload it into cgi-bin folder.

10. Ssh by putty and login to your cgi-bin dir (cd /home/geryit/mw.geryit.net/cgi-bin) and create an htpasswd file there to prevent the access to cgi-bin folder for others (type: htpasswd -bc .htpasswd username password)

11. Create a do_update.cgi file on desktop and add this code into that:

#!/bin/sh
set -f
echo "Content-type: text/plain; charset=iso-8859-1"
echo
svn update /home/geryit/mw.geryit.net

and set the CHMOD to 755 for this file (on cuteftp, right click to file and select properties) and upload it to cgi-bin folder

12. Create a “post-commit” file on desktop and add this into that:

#!/bin/sh
wget --http-user=username --http-passwd=password -qO - http://mw.geryit.net/cgi-bin/do_update.cgi

(Username and password are the things you set on step 10)
and upload it to /home/geryit/svn/mindwork/hooks

13. Ssh by putty again and checkout your svn (svn checkout http://svn.geryit.net/mindwork /home/geryit/mw.geryit.net)

14. Now you can login to your repo by Tortoise Svn or some other svn clients (http://svn.geryit.net/mindwork)

You can visit http://wiki.dreamhost.com/Subversion for more.

]]> http://geryit.com/blog/2010/07/auto-update-svn-on-dream-host/feed/ 1 Html5 Video Converter for Windows http://geryit.com/blog/2010/06/html5-video-converter-for-windows/ http://geryit.com/blog/2010/06/html5-video-converter-for-windows/#comments Mon, 28 Jun 2010 02:22:43 +0000 admin http://geryit.com/blog/?p=463 After spending 2 hours I finally found a working converter for my Html5 website. As you know OGG(Open Video Format – Theora) or OGV video formats work well with Firefox (pc&mac) but it is hard to find a OGV/OGG converter. Lucky that I found a good one. You have to use Command Prompt but it worths.

Now visit this page and download ffmpeg2theora to your pc and go to here to see how to convert your videos. Good luck!

You can also visit here if you don’t like hand coding.

]]> http://geryit.com/blog/2010/06/html5-video-converter-for-windows/feed/ 0 Sweden: Cheap Beer, Bad Weather, Hot Girls http://geryit.com/blog/2010/06/sweden-cheap-beer-bad-weather-hot-girls/ http://geryit.com/blog/2010/06/sweden-cheap-beer-bad-weather-hot-girls/#comments Sat, 19 Jun 2010 19:26:03 +0000 admin http://geryit.com/blog/?p=456 It’s my 19th day in Sweden and It is gonna be my last week here. I enjoyed a lot and sometimes got bored of the weather. Hope to be here next summer again.

]]> http://geryit.com/blog/2010/06/sweden-cheap-beer-bad-weather-hot-girls/feed/ 0 Comparison of web browsers http://geryit.com/blog/2010/06/comparison-of-web-browsers-2/ http://geryit.com/blog/2010/06/comparison-of-web-browsers-2/#comments Sat, 19 Jun 2010 12:56:56 +0000 admin http://geryit.com/blog/?p=449 See the compatibility tables for features in HTML5, CSS3, SVG and other upcoming web technologies here

]]> http://geryit.com/blog/2010/06/comparison-of-web-browsers-2/feed/ 0 Google Font API http://geryit.com/blog/2010/06/google-font-api/ http://geryit.com/blog/2010/06/google-font-api/#comments Wed, 09 Jun 2010 03:42:16 +0000 admin http://geryit.com/blog/?p=437 Google announced their new Font API yesterday, including a font directory andpreview tool. They teamed up with TypeKit, to build and open source the WebFont Loader.
More…

]]> http://geryit.com/blog/2010/06/google-font-api/feed/ 0 The Best Cross-Browser Testing Tool Ever : Adobe BrowserLab http://geryit.com/blog/2010/05/the-best-cross-browser-testing-tool-ever-adobe-browserlab/ http://geryit.com/blog/2010/05/the-best-cross-browser-testing-tool-ever-adobe-browserlab/#comments Tue, 11 May 2010 03:59:11 +0000 admin http://www.geryit.com/blog/?p=431

Seemingly the successor of Meer Meer from Adobe, Browserlabs is a sleek new service for testing your websites across browsers. It tests Firefox 2 and 3 and IE 6 and 7 for XP and test Firefox 2 and 3 and Safari 3 for OS X. Just sign in with your Adobe account, put in a URL and let Browserlab load screenshots for these browsers. Brilliant 2-up and onion-skin views allow you to compare between browsers easily. Unlike some browser testers, the entire page is visible, header to footer with scrolling. I’ve already noticed some particularly slow loading browsers and it would be great if it could build the page so you could navigate a site like a native browser test but it’s a great new product from Adobe.

Test your website now!

]]> http://geryit.com/blog/2010/05/the-best-cross-browser-testing-tool-ever-adobe-browserlab/feed/ 0 Introduction to the fundamentals of PHP http://geryit.com/blog/2010/05/introduction-to-the-fundamentals-of-php/ http://geryit.com/blog/2010/05/introduction-to-the-fundamentals-of-php/#comments Sun, 09 May 2010 03:01:28 +0000 admin http://www.geryit.com/blog/?p=425 In this article, I’ll introduce you to the fundamentals of PHP. We’ll focus on using PHP to access Web services and on turning static HTML pages into dynamic ones by retrieving data from the Web and by showing different content depending on what the user has entered in a form or requested in the URL.

You won’t come out a professional PHP developer, but you’ll be well on your way to building a small page that uses Web services. You can find a lot of great PHP info on the Web, and most of the time you will end up on PHP.net itself. But I was asked repeatedly on several hack days and competitions to write this quick introduction article, so here it is.

Continue Reading…

]]> http://geryit.com/blog/2010/05/introduction-to-the-fundamentals-of-php/feed/ 0 Guitar Hero 5 Director's Cut Music Steve Trailer http://geryit.com/blog/2010/05/guitar-hero-5-directors-cut-music-steve-trailer/ http://geryit.com/blog/2010/05/guitar-hero-5-directors-cut-music-steve-trailer/#comments Wed, 05 May 2010 06:34:08 +0000 admin http://www.geryit.com/blog/?p=416 This is the Director’s Cut to the Guitar Hero® 5 Music Steve video. Special Thanks to ‘Make The Girl Dance’ for use of the song ‘Baby Baby Baby’

]]> http://geryit.com/blog/2010/05/guitar-hero-5-directors-cut-music-steve-trailer/feed/ 0