1. Home
  2. Development
  3. RE: Theme with Themelet

RE: Theme with Themelet

Frank Illner, modified 9 Years ago.
Theme with Themelet
New Member Posts: 4 Join Date: 11/14/16 Recent Posts
Hi,
i try to build a themelet. I use the instruction of "Building Themes in Liferay 7 Workshop
Nate Cavanaugh".

Here are the steps:
Building Themes in Liferay 7 Workshop
Liferay Developer Conference 2015
Creating a theme
1.From the command prompt, cd into Workshop/Themes
2.Type yo liferay-theme
3. Fill out prompt (accept all defaults)
4.There should be a folder called my-liferay-theme
We’ll come back to this theme when we build and extend

Creating a themelet
1.From the command prompt, cd into Workshop/Themes
2.Type yo liferay-theme:themelet
3.Fill out prompt (accept all defaults)
4.There should be a folder called my-liferay-themelet
5.cd into my-liferay-themelet
6.Type npm link to install the themelet globally
7. Open the directory in your editor (Sublime Text/Atom/etc.)
Building Themes in Liferay 7 Workshop
Liferay Developer Conference 2015
Creating a themelet (continued)
8.Edit src/css/custom.css to change the font-weight of the text on the page to bold
9.Save the file

Building a theme
1.cd into Workshop/Themes/my-liferay-themelet
2.Type gulp build-> If I do this, I get the error message: "No gulpfiles.js available"
3.Verify that my-liferay-themelet/build

What can i do?

Thanks
Frank
Debora Rebai, modified 9 Years ago.
RE: Theme with Themelet
New Member Posts: 8 Join Date: 12/16/16 Recent Posts
Hi!

Create theme and themelet.
Change your css in your themelet.
In your bash/cmd : npm i -g [path of themelet]
In your THEME-PATH open cmd:

gulp extend (your gulpjs it's located in this folder)
->Selected "themelet" (2)
(1) (global)
Add your themlet!

Gulp deploy and enjoy!

Debora
Ravi Shankar, modified 7 Years ago.
RE: Theme with Themelet
Junior Member Posts: 40 Join Date: 7/13/16 Recent Posts

Hi,
I have created a themelet by following steps mentioned here-https://community.liferay.com/blogs/-/blogs/liferay-7-themelet, After Deploy of my extended Theme, My Themelet properties and css not going to reflect.


For using themelets i did some steps like:

  • I created  the themelet (yo liferay-theme:themelet) within Our Theme folder.(D:\liferay7ga3\plugins\themes\Test-themelet)
  • I installed  that themelet (npm link within Our themelet folder)
  • I wrote some css inside _custom.scss file (D:\liferay7ga3\plugins\themes\Test-themelet\src\css)
  • I did use that themelet in Our  theme (gulp extend within Our theme folder)
  • I did rebuild and Deploy  of Our Theme(gulp build and gulp deploy)

    but i am not getting any reflection in my theme  Please help.
thumbnail
Michael Adamczyk, modified 7 Years ago.
RE: Theme with Themelet
New Member Posts: 11 Join Date: 3/16/12 Recent Posts

You might be missing the import in your _custom.scss (or other scss file in your theme):

/* inject:imports */
/* endinject */