Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.
+5 votes
397 views
in Themes by
edited by

Frapuchino, a Shape-Shifting Material Design Theme.

For those who acquired Frapuchino during the pre-release season, please check your email and spam boxes. A "Care-package" has been sent to you. xD


Thank you for being awesome. Welcome to the ship! :)

(Pre-release discount has now expired)

Carefully engineered

Based on collected data and attributes from our previous theme Muffin, Frapuchino was born. 

The theme was created almost like a Web App, with motions that focus our attention and maintain continuity through subtle feedback and coherent transitions.

Colors, components and User Experience

Frapuchino is no different than Muffin when it comes to User Experience. This is the foundation and main concept of their core.

Color, components and their placements do far more then just please the eye. They create hierarchy, meaning, focus and a graphic interface that immerse the user experience.

Live Preview - Frapuchino Online
Purchase theme - Buy Frapuchino

Shape Shifting

Swap from normal list to grid list with thumbnails with ease.


Screenshots

Screenshot 1 - Normal list page 
Screenshot 2 - Grid list with thumbnails
Screenshot 3 - Single Page question
Screenshot 4 - User profile page 
Screenshot 5 - Mobile screenshots


Live Preview - Frapuchino Online
Purchase theme - Buy Frapuchino

Frapuchino. Much more than a theme. An Experience.

by
+3
Congratulations for putting so much work into this! Looks great!
by
Thank you @q2apro , I appreciate it :)
by
+1
Congrats, looks great on front end. I also think you need to optimize its SEO.
https://gtmetrix.com/reports/frapuchinolive.unaux.com/B6nmgM4S
by
+1
I really liked your work. Desktop version is mind-blowing but mobile version is not similar to destop
by
edited by
Thanks for the feedback @esqeudero and @j.kargo :)

3 Answers

+2 votes
by
selected by
 
Best answer

To add custom HTML widgets, navigate to:
Admin > Layout > Custom HTML in sidebar box on every page


To use these custom widgets, you just have to wrap your text inside the following bit of code:

<div class="priside prigroove1">
    Your Text Goes Here.
</div>

Change the prigroove1 part, to change colors:

prigroove / prigroove0 = White color
prigroove1 = Frapuchino Blue Gray
prigroove2 = Blue & Green, Gradient
prigroove3 = Pink & Orange, Gradient


The Buttons inside Custom HTML Widgets

There's 2 options of buttons to be used inside the widgets:

Normal Button (green) = <button type="button">Button</button>
And Neutral Button (grey) = <button type="button" class="neutralBtn">Neutral Button</button>


How to have multiple widgets like the demo?

Just pile them up on top of each other:

<div class="priside prigroove1">
    Your Text Goes Here.
</div>

<div class="priside prigroove2">
    Your Next Goes Here.
</div>

+1 vote
by

Hi. I bought the frapuchino theme, it looks amazing!!!

I have a question. How to have sidebar like demo?

by
Yeah, I forgot to add that as documentation. I'll create a post later today explaining how, when I get more time.
+1 vote
by

Hi. I bought the frapuchino theme aslo yestoday, it looks very confortableļ¼Œ  i will create some contents after a few days, maybe it should be looks very substantial, thanks ""

...