Showing posts with label php. Show all posts
Showing posts with label php. Show all posts

2013-12-19

[OrangeHRM v3.0.1] Template / theme files and locations

Login page template file and location:
\symfony\apps\orangehrm\modules\auth\templates\loginSuccess.php
Admin / main template file and location:
\symfony\apps\orangehrm\templates\freshorange.php
\symfony\apps\orangehrm\templates\freshorange.php


[OrangeHRM v3.0.1] How to change login page

To re-theme / re-design the login page edit loginSuccess.php, path:
\symfony\apps\orangehrm\modules\auth\templates\loginSuccess.php
 Make a backup copy of this before making changes.

Coming soon (tomorrow) how to clean up the page and have a generic, modern login page using CSS and HTML5.





\symfony\apps\orangehrm\modules\auth\templates\loginSuccess.php - See more at: http://unofficialmods.blogspot.co.uk/#sthash.mpM4YOUW.dpuf

[OrangeHRM v3.0.1] How to change logo images

There are two logo images:
  • Path to logo image used on login screen:
    /symfony/web/webres_521db8499614c0.51100681/themes/default/images/login/logo.png

    Width: 339px Height: 66px
  • Path to logo image used after logging in:
    /symfony/web/webres_521db8499614c0.51100681/themes/default/images/logo.png

    Width: 283px Height: 56px
I recommend renaming those images and uploading your own logo and renaming the file to logo.png

Note: when the mouse pointer is hovered over the logo "OrangeHRM" is displayed as the HTML ALT text.  This can be changed by editing freshorange.php, path:
\symfony\apps\orangehrm\templates\freshorange.php
 Search for alt="OrangeHRM" text and replace OrangeHRM with whatever you want.

You can also edit the hard-coded image dimensions for the logo.png image in layout.php.  Search for logo.png text and then edit the width and height.  Look from about line 51.

Notes about the login page
  • On the login page there is no alt text or hardcoded image dimensions for the logo image
  • Beware if your logo is not height 66px, it will mess up the CSS positioning of the various elements on the form in the login page
  • You can edit loginSuccess.php to hard-code your own image dimensions, path \symfony\apps\orangehrm\modules\auth\templates\loginSuccess.php
  • My next blog post will focus on modifying and re-theming the login page

[OrangeHRM v3.0.1] How to edit or remove the footer copyright text and social icons on the login page


1. To edit or remove the footer text on the login and post-login pages 

Edit the _copyright.php file, path:
\symfony\apps\orangehrm\templates\_copyright.php
The file contents are the following:
Line
1     <?php
2     $version = '3.1.1';
3     $prodName = 'OrangeHRM';
4     $copyrightYear = date('Y');
5    
6     ?>
7     <?php echo $prodName . ' ' . $version;?><br/>
8     &copy; 2005 - <?php echo $copyrightYear;?> <a href="http://www.orangehrm.com" target="_blank">OrangeHRM, Inc</a>. All rights reserved.
9    
 You can edit this as you want.  Here is my suggestion if you want to remove everything, delete lines 7, 8 and 9:
Line
1     <?php
2     $version = '3.1.1';
3     $prodName = 'OrangeHRM';
4     $copyrightYear = date('Y');
5    
6     ?>
This will now look like:
This is quite a nice, clean result.

However, if you want to have custom text in there try this:
Line
1     <?php
2     $version = '3.1.1';
3     $prodName = 'OrangeHRM';
4     $copyrightYear = date('Y');
5    
6     ?>
7     <br/>
8     &copy; <?php echo $copyrightYear;?> Company Name. All rights reserved.
9    
 This will look like:

2. Remove the social sharing links from the footer


Let's be honest that's quite unprofessional, would you really deploy OrangeHRM in to your workplace leaving those links there?  Not me.

We can quite easily apply a CSS mod to remove them.

Edit main.css, path:
\symfony\web\webres_521db8499614c0.51100681\themes\default\css\main.css
/symfony/web/webres_521db8499614c0.51100681/themes/default/css/main.css - See more at: http://unofficialmods.blogspot.co.uk/#sthash.4BDZbVgh.dpuf
Depending on if you have modified main.css before, go to about line 351 or 353.  In my case it is line 353, alternatively search for the text #social-icons

This section should look like:
Line
353     #social-icons {
354        margin-top: 5px;
355     }
 After line 353 add display:none; so it should look like this:
Line
353     #social-icons {
354        display:none;
355        margin-top: 5px;
356     }
 Save the changes and refresh the browser on the login page, the social icons will not display now.