I enjoyed working on this project this week. The ability to be able to see your work come to life makes it addicting to be honest. I didn’t want to put it down, I didn’t want to go to bed. But as fun as it was it definitely came with its set of challenges. One that took me too long for me to admit was a design feature. I created my project with the Corneal gem with came with a set design. I of course wanted to venture off from that and play around with other options. I was told that bootstrap is a great place to start because of its “simplicity” but to be honest when you aren’t even sure where to start it gets pretty tricky.
I searched, googled, and YouTubed my day away. Finally, I was able to find two useful videos to get started. Heres what I learned.
- When you go to the main bootstrap website they give you the option to download or copy and paste a specific code to begin using the bootstrap css framework. I chose the copy and paste option. I pasted this code in my layout page in which my whole projects design feature is grabbed from.
- Bootstrap it self has “Example” templates in which you are able to use for a whole page or even just bits and pieces of it. I went to one of the examples that interested me and right clicked and selected “source code”. I copied and pasted the part I wanted into my layout as well as other erb files that needed it.
- In the source code for the example template exist the link for the css. I copied and pasted the whole code into a new .css file in my stylesheets folder and I made sure I referenced the new file in my layout page.
- From here is just a matter of trial and error and playing around with different code to make it the way you want it.
Again bootstrap is simple -now that I know the process. But I also know that I scratched the surface. I hope this post helped you if you are also new to css frameworks.