Intertwine two different Bootstrap Templates - is it possible and how?

Question

So I have a nice, professional bootstrap template which I have edited images and vocabulary with; created multiple pages, etc. Now I would like to add a page in which I would like to add a nice calendar on (for others, you may want to add to/include other things). But lets say we search for a bootstrap add-on but would like to keep our original site to have the same general format as the rest of the pages...you know, to keep the same custom style.

Well that's where I'm at now with the calendar I found HERE where I attained a zip file supplying me with the CSS, JavaScript, a LESS file and an index. What I'd like to do with it is "insert" the index file into a renamed version of my main template (calendar.html), probably edit around a little bit and go from there. But is this possible? And if so, how should I go about the process because when I opened the calendar's index many source codes had the same names and source codes which already exist in the original/basetemplate. And in the calendar's folder, it's CSS file is "style.css" so I imagine I would have to rename that too, right?

Any ideas or how-to I'm open to hear

BenPleysier · Accepted Answer

I checked out all my source codes along the top and no official Bootstrap codes went over a 4. So I assume I'm safe. I also deleted all the "old" bootstrap css's, js's and jQuery js's you noted and surprisingly (for me) no differences were made to the layout of the site . might go back to other pages and do the same.

So the page still looks how I want it but I'm back to a major issue: how can I edit the calendar now to fit the site? I'm referring to specific business events - not the ones the calendar purposely demonstrated along with the installation because it serves no purpose. I tried to cut/delete events already there on the screen but was unable to. I went to index.js which in a previous imagine/screen shot showed a lot of the items on the screen currently. I figure there has to be a semi-simple way to adjust the title, time and description of each event, right? Any simple ways to click on the day, enter the event/time and BAM it works???

Still not quite correct

and

The last two lines still need deleting.

As far as the data goes for the Calendar, this is most awkward. The data comes from index.js where event names and descriptions (slipsum) are presented as an array and the dates have been allocated at random. Without going into it too deeply, I am not sure how this data is transferred to the calendar. The source of the calendar is 5 years old and there seems to be no documentation or support.

Personally I would use the Google Calendar API to show a calendar on my site (haven't had to as yet), but you could also embed a Google calendar as per Add a Google calendar to your website - Calendar Help or Google the subject.

johns45317965 · Answer

Thanks to the both of you for the replies. Nancy OShea, the purpose of the calendar was simply to post events so the visitors of the site can simply "see what's going on" and when, if that makes sense. Not so visitors can interact or anything like that.

Considering the calendar I was trying was 5 years old AND was giving me a hard time in figuring out how to post events, I went with BenPleysier's suggestion and tried installing the Google Calendar API. It may not look picture-perfect how I wanted it, but in regards to everything it can do and directly being able to work through a Google business account = it's pretty darn nice!

So in end, thank you both for some learning basics on how it's possible to intertwine bootstrap templates from different sources, but need to use "just one version of a framework per document" - as it's best to filter-out the older CSS's and JS's (which I never really did or thought was important). Oh........and thanks for hinting to me a good calendar that works nicely on a site too.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded