cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
bgibson
Community Champion

Developing Course Pages Using Bootstrap

I had been looking at the Bootstrap training materials Bootstrap Grid Basic​ at w3schools.com but then went out and found several online sites that offer a "drag-n-drop" Bootstrap page/site builder.  Here is a free app, for Windows & Mac, Free Mobile Website Builder Software that makes it easy to develop a set of impressive Bootstrap inspired pages, including page navigation.  You can even publish via FTP or to an accessible drive.  Once I had all the pages & necessary sub-folders under one main folder, I zipped them up, Uploaded & had Canvas Unpack them into the Files area.  I then created a Page, and added a link the the "index.html" file that was in the newly created folder.  *But I got this idea from a post by Sharmaine Regisford, some time ago, to embed the page directly into a canvas page via an iframe.  **Looks nice and the site navigation works, but I did see a couple of glitches in that some of the icons used in the pages were not found when the pages were displayed from within Canvas. 

Maybe this doesn't work in the Canvas Mobile App, but the pages are highly responsive... like Canvas.

bsx03.jpg

4 Replies
msgarcia
Community Contributor

I can't believe this doesn't have more responses. I discovered mobirise pretty close to around the time it seems you did, and I like to use it as a complimentary means to creating responsive websites. I typically build out my template using mobirise, and then go into the code afterwards in Sublime and edit it to make it fit a bit more with my vision or add in styles that are not fully supported by it.

I have additionally recommended it to be used at our institution by the faculty for the purposes of creating their faculty websites, as many of them don't really care to code html or css.

bgibson
Community Champion

I have promoted WordPress (our hosted version) for our faculty sites, but I could see using something like Mobirise for that, especially if they have a large number of files that they want to organize and deliver.  That is something that WP isn't good at.  We used FrontPage and then Expression Web for our faculty sites.  Both of these have gone by the way side and recently I had an instructor ask about one of these old sites.  Instead of using FTP to access his content, we just gave him network access, and he was still able to use the last copy of Expression Web to maintain the site.

With using a Mobirise site within Canvas, I saw that the Mobirise "icons" were not being displayed.  I think it was a case of these being delivered via a non-secure site and Canvas was blocking them.

msgarcia
Community Contributor

The issue you are encountering with the icons is probably exactly that (you can access the Browser console to see if that is the case). If that truly is the cause, then I would suggest hosting the individual CSS and JS files associated with the mobilize site on GitHub or Bitbucket as you can create private repositories where these files will be hosted, and they will have the https url that Canvas requires.

isaac_piercy
Community Participant

 @bgibson ‌,

This looks good! Any live versions of this that we can take a look at within a Canvas course?