❊⚹*DON’T LOOK THROUGH ME - A (FLIP)BOOK PAGE BY RECSBYLOTTE *⚹❊
Highly customizable ( colours, fonts, pictures etc. )
Navigation by keyboard + buttons + dragging page corner + clicking page side
Page numbering by adding class “page-number” ( see first preview )
Table of contents by adding class “table-contents” ( see first preview )
Every first letter of a <p> can be made a capital by adding class “capital” ( see first preview )
Own sized pages option so you can see hard cover
Display both content by uploading images ( see flipbook ) or style full HTML ( see book )
Displays both normal images, transparent images ( PNG ), animated images ( GIF ) and videos.
You can decide your own size of your book ! I’ve marked all the places where you need to add the same values by “sidexx” so if you click Ctrl + F, you can search it easily.
Feel free to play around with font-sizes; button-sizes etc.
Fonts used in previews: Brother Deluxe, Garamond Latin Roman and Geo Sans Light
Are there any other features with this plug-in ? Yes, feel free to check out the turn.js page for all the info. They’ve got incredible features such as a slider bar and zoom function !
How do you lay-out your pages ? I found the easiest thing to do is create your page elsewhere, such as Photoshop, Word, PicMonkey etc. ( just any place really ). You make sure that your page has the right size, or at least proportion, and save it as a png ( to keep transparency if you have any ) Then you upload it somewhere on a host site such as Imgur OR you can use already uploaded pictures on a webpage. As long as you right click the image, choose “open image in new tab” and make sure the URL ends with .jpg; .png or .gif. Then copy that URL and put it in your HTML code with e.g. the image tag <img src=“URL”>
Can I embed videos ? Yep ! All you need is a link to a video ( which ends in .mp4, .mov etc. )
Where can I find navigation buttons ? You can Google it but I used a pack from flaticon or made them myself with Photoshop.
This is my first time using javascript plug-ins ! I hope I did it somewhat right and made it more accessible to those of you who also have no clue how to start on this ! I couldn’t find a theme quite like this already out there, if you know of one however, feel free to message me !
I hope you enjoy this theme, you may use it for any purposes, just don’t steal it or delete the credit, thank you !
You may always contact me about any changes you’d like to see or tweaks/improvements you had in mind etc. My inbox is open, lovelies!
// PREVIEW 1 (BOOK) // PREVIEW 2 (FLIPBOOK) // CODE 1 (BOOK) // CODE 2 (FLIPBOOK) // INBOX //