Nirav Panchal (Web Designer): February 2011

Monday, February 14, 2011

Joomla Template Integration = Very Important

Steps for joomla integration of your own design.

(1) copy any joomla template and make its copy. and rename the original one with ur own project name..

(2) put your whole main div code to the index.php of the perticular template.

(3) make its own default module.. each module for each section...

(4) in joomla administrator module go to module manager and click on new.

(5) select custom HTML.

(6)give the title enable it, put the position which is described on your own module in php file for example

<jdoc:include type="modules" name="home_banner" />

(7) put ur html code in html area... and thats it...

(8) put ur all images in to ur template images folder as well joomla main images folder also...

(9) put css in css folder of template.

(10) main middle area or content area is work dynamically so put that code separate with the code

<jdoc:include type="component" />

(11) this component is in the component folder work with dashboard area....

components\com_dashboard\views\dashboard\tmpl

u must need to change ur data as per ur requirement....

(12) put this code on the top of ur index.php for error message display..

<jdoc:include type="message" />

Thursday, February 10, 2011

ERROR message == Displays very good design for Error Message

Copy this code to your CSS.... and use as individual as defined....
.success {
color: #4F8A10;
background-color: #DFF2BF; border: 1px solid;

/*------ for error -------*/
color: #D8000C;
background-color: #FFBABA; border: 1px solid;

/*------ for warning -------*/
color: #9F6000;
background-color: #FEEFB3; border: 1px solid;

margin: 10px 0px;
padding:15px 10px 15px 20px;
background-repeat: no-repeat;
background-position: 10px center;
}

this is for span which is used for image set in HTML

.error span { margin: 0px 0px 0px 10px; font-family:calibari, arial; font-size: 14px; padding: 0px; vertical-align:top; line-height: 35px;}

Copy This CODE to your HTML also use with individual classes as defined in CSS.

<div class="error"><img src="image/error.png" alt="error" border="0" align="top" /> <span>Enter correct Username or Password</span></div>

Font Face Working in All Browsers.... Must use it.... By Jasmin Kanani...

Put this code to your <head> Section of youor HTML page.

Create NEW CSS named ie.css and put the below code to that CSS and make sure the font extention must be .eot for internet Explorer.

@font-face {
font-family: erasdust;
src: url('../font/ERASDUST.eot');
}

And for other Browsers put the below code to the your main CSS

@font-face {
font-family: erasdust;
src: url('../font/ERASDUST.TTF');
}

Note: Don't forget to make folder for fonts and put the fonts in that folder only....

Wednesday, February 9, 2011

Contact form code very easy

<?php

if(isset($_POST['submit']))
    {




            $email='niravpanchal29@gmail.com';
            $subject ="Contact from your site name" ;
            $body = "<table>";
            $body .= "<tr><td>Name </td><td>:- ".$_POST['first_name']." ".$_POST['last_name']."</td></tr>";
            $body .= "<tr><td>Phone </td><td>:- ".$_POST['phone']."</td></tr>";
            $body .= "<tr><td>Alt Phone </td><td>:- ".$_POST['altphone']."</td></tr>";
            $body .= "<tr><td>Zip</td><td>:- ".$_POST['zip']."</td></tr>";
            $body .= "<tr><td>HomeOwner?</td><td>:- ".$_POST['HomeOwner']."</td></tr>";
            $body .= "</table>";

            $headers = 'MIME-Version: 1.0' . "\r\n";
            $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
            $headers .= 'From:niravpanchal29@gmail.com <niravpanchal29@gmail.com>' . "\r\n";
            mail($email, $subject, $body, $headers);


            echo '<script>    window.location="thankyou.html"
                            </script>';



    }

?>

And put this code in thank you.html page

<script type="text/JavaScript">
setTimeout("location.href = 'index.php';",5000);
</script>
</head>

<body>
<div align="center">
<p
style="color: rgb(102, 102, 102); font-weight: bold; font-size: large;">Thank
you
very much for contacting us. <br>
We will be in touch with you soon. </p>
</div>

Javascript for onover image and content change best working

Search This Blog