Step by step to add a new color scheme to your theme

 


For example: Inspire theme

To add a new color scheme please follow these steps :

1- Preparing the color file under /inspire-theme/docroot/diffs/css/color_schemes Folder

- Note: you need to prepare a background image and put it under  /inspire-theme/docroot/diffs/images/color_schemes/ Folder with a name for example bg-mycolor.jpg.

- create a new file for example mycolor.css and put all these lines with your colors:

.aui{
     body.skin-black  {
     background: #08BEF1 url(../../images/color_schemes/skin-mycolor/bg-mycolor.jpg) no-repeat top;
}
.skin-mycolor .aui-menu-content li a.aui-focus, .skin-black .lfr-menu-list ul .taglib-icon.aui-focus,.skin-black .lfr-menu-expanded li a:focus {
background-color: #08BEF1;
color: #FFFFFF;
text-shadow: -1px -1px #08BEF1;
}

}

2- Add the line bellow to custom.css file under  /inspire-theme/docroot/diffs/css/ Folder :

/* ---------- color schemes import ---------- */

@import url(color_schemes/green.css);
@import url(color_schemes/black.css);
@import url(color_schemes/brown.css);
@import url(color_schemes/darkgreen.css);
@import url(color_schemes/grey.css);
@import url(color_schemes/lightblue.css);
@import url(color_schemes/lightred.css);
@import url(color_schemes/pink.css);
@import url(color_schemes/red.css);
@import url(color_schemes/violet.css);
@import url(color_schemes/mycolor.css);
 
3- Add your new color scheme to theme settings:
 
- Note: you need to prepare an image thumbnail and put it under  /inspire-theme/docroot/diffs/images/color_schemes/skin-mycolor/Folder with a name for thumbnail.png( that's for showing your color scheme in theme settings).
 
- Go to /inspire-theme/docroot/web-inf/ Folder and open the liferay-look-and-feel.xml file 
- you will see that there are many color scheme
- Add these lines bellow the last color scheme:
<color-scheme id="12" name="mycolor">
      <css-class>skin-mycolor</css-class>
      <color-scheme-images-path>${images-path}/color_schemes/${css-class}</color-scheme-images-path> 
</color-scheme>

Download Themes on Themeray

0 comments:

Integrate Google reCaptcha 2.0 on liferay 6.2

 1. Prerequis : 

- Liferay Google Recaptcha plugin and hook downloaded from : Link

- Google Recaptcha Api keys : Public and Private keys

2. Create Google Recaptcha Api Keys : 

Go to the google recaptcha site : https://www.google.com/recaptcha/. You will see a Admin Console button at the top-right corner. It will redirect you on Google reCAPTCHA Adminpage(It will ask for login to Google, if already not).



When you click on the button registre new site You will see a screen like below: 

You can give value whatever you want for Label field. You need to choose reCAPTCHA v2 option. You need to add your domain to Domains field as shown in the above image. You can use multiple domains with single key/secret. After adding values to Label and Domains fields, click on Submit button.

You will redirected to a page where you will get Site key and Secret key as shown in below image:


Note : these both keys, it will require to authenticate your site with Google reCAPTCHA.

 
3. Deploy Google Recaptcha Liferay Hook and Ext plugin:
 
Disclaimer: Hence, this is an Ext plugin deployment, it is advised to first try with the Liferay server other than the Production Liferay server and test properly as per your environment configuration. We will not be responsible for any kind of damage to the Liferay server and data loss.
 
 
Now, you have to deploy attached Hook plugin first and then deploy Ext plugin. On successfully deploy ext plugin, you must have to restart your Liferay server.
 
Note : The Liferay server accept only one ext plugin project, if you have  onther one on your server you need to add the java classes from ext-impl folder under recaptcha ext plugin to your ext project.
 
4. Enable reCAPTCHA:
 
Now, Login to Liferay portal with administrative user’s credential and go to Liferay > Control Panel > Configuration > Server Administration > CAPTCHA as shown in below:


Tick Enable reCAPTCHA. Provide Site key to reCAPTCHA Public Key and Secret key to reCAPTCHA Private Key fields, and then Save your changes



0 comments:

Liferay Unify Education Theme






#Unify is an incredibly beautiful and fully #responsive #Bootstrap 4 Liferay #Template for any type of #creative #professionals, startups and established #business.


1 comments: