3D FlipBook - 3D FlipBook and SASS question

a***o@gmail.com
2019-12-02
2019-12-03

Cheers, I've recently bought 3D FlipBook for WP and now I'm trying to create a custom skin but I can't find a thorough guide/documentation about it.

My website's main (and only) css file is generated through SASS and I'd love to be able to use SASS to compile the 3D FlipBook skins aswell (that would allow me to use the global color/fonts/spacing variables I use for everything else on my website, aswell as to keep my project well structured and clean).

What I've tried to do so far: I duplicated one of the default skins inside "assets/css" and called it myskin.css. I registered it inside the inc/template.php file. I selected it from the plugin settings in the WP dashboard. I cut all the code inside myskin.css and pasted it into my SASS files. I compiled my SASS files into my main css file.

However the styles don't get applied to the HTML elements...my guess is that either WP loads the plugin before my css is loaded or it has something to do with the way the plugin loads the skin files. Do you have any clue? Is there a proper way to work with 3D FlipBook and SASS?

Thank you in advance!

Replies

a***r@3dflipbook.net
2019-12-03
2019-12-03

You can use SASS - no problem. Plugin works inside iframe to avoid style conflicts so it has its own style sheets that you can see in inc/template.php. You need to compile a CSS for the plugin with your changes.

a***o@gmail.com
2019-12-03
2019-12-04

Cheers and thank you for your reply. So you're suggesting to compile the SASS file in the 3d-flip-book/assets/css folder and call it "mycustom-view.css"? If that's the case I've already thought about it but the problem is that I'm using a visual studio code plugin to watch and compile my sass files and I can't specify different output paths for different scss files...

Do you think it would be possibile/make sense to compile plugin css into the same folder of my "main.css" file and modify the template.php file so it points to my theme's folder? E.g: https://pastebin.com/UGxb7yXs

Thank you for your support!

a***r@3dflipbook.net
2019-12-04
2019-12-04

You can use any available from browser URL. If it is ok for you then you can put it together with main.css.

a***o@gmail.com
2019-12-12
2019-12-12

Thank you. Should anyone need this in the future I menaged to get this working by replacing
'styles'=> array(ASSETS_CSS.'black-book-view.css') with 'styles'=> array(WP_CONTENT_URL . '/themes/MY_THEME_FOLDER/theme/css/main.min.css') in the templates.php file.

Log In to leave a comment