Bootstrap Playground - new forum posts

Re: hi

Tue, 27 Jan 2026 09:27:06 +0000

Hi hi!
I wandered in here, too, barely know what this site is about.

Forum category: Wikidot Integration / Custom Layouts
Forum thread: hi

hi

Thu, 17 Nov 2022 23:51:41 +0000

nice bootstrap :3

Forum category: Wikidot Integration / Custom Layouts
Forum thread: hi

Re: Bootstrap questions

Mon, 30 Aug 2021 02:49:15 +0000

thank for share,

Forum category: General Discussion / The Lounge
Forum thread: Bootstrap questions

Re: Bootstrap questions

Mon, 01 Feb 2016 10:22:29 +0000

Figured it out:

Example

[[a class="btn btn-default btn-block" href="http://www.example.com/"]] [[span class="fa fa-taxi fa-2x"]]@< >@[[/span]] Example [[/a]]

Forum category: General Discussion / The Lounge
Forum thread: Bootstrap questions

Bootstrap questions

Sun, 31 Jan 2016 18:35:30 +0000

Hello!

If I have some questions regarding Bootstrap & Wikidot, would you recommend posting here or at the community forum? The people who help, are more or less the same anyway… The examples (as below) will not work on the community site. Anyway, here's the question:

Below is a wide Bootstrap default button. If you click anywhere else than the icon or text, nothing happens (the button changes color though). How should I change the code for it to work properly (as a "real" button instead of just a text link)?

Example

[[span class="btn btn-default btn-block"]] [[a href="http://www.example.com/"]][[span class="fa fa-taxi fa-2x"]]@< >@[[/span]][[/a]] [[a href="http://www.example.com/"]]Example [[/a]] [[/span]]

Thanks!

Btw. I find it strange that there isn't that much activity here. When Ed started this, I kind of expected it to become a Wikidot community forum equivalent for Bootstrap oriented discussion and questions. Even all of the example sites have been deleted.

Forum category: General Discussion / The Lounge
Forum thread: Bootstrap questions

Re: installing bootstrap

Tue, 10 Mar 2015 17:39:27 +0000

I'm in the same boat as you…have been using wikidot for years now and can't seem to make sense of how to implement this much needed functionality.Considering changing platforms.

Forum category: General Discussion / The Lounge
Forum thread: installing bootstrap

Re: Stacking FontAwesome Icons?

Tue, 25 Nov 2014 05:04:28 +0000

Thanks Ed!

Forum category: Wikidot Integration / Nice to have
Forum thread: Stacking FontAwesome Icons?

Re: Stacking FontAwesome Icons?

Mon, 24 Nov 2014 05:19:35 +0000

Here's the Font Awesome 4 CSS that has what you need. You could copy just the parts you need or download v4.2 and add it to your site using an @import… rule.

Forum category: Wikidot Integration / Nice to have
Forum thread: Stacking FontAwesome Icons?

Re: Stacking FontAwesome Icons?

Mon, 24 Nov 2014 04:58:58 +0000

Hi Ed and thanks for the info, I'll try to figure it out!

Edit: Oops, wrong account. It's jjs here, as in the original post.

Forum category: Wikidot Integration / Nice to have
Forum thread: Stacking FontAwesome Icons?

Re: Stacking FontAwesome Icons?

Mon, 24 Nov 2014 04:52:13 +0000

It looks like the classes for Font Awesome v4 were rewritten according to the link you referenced. Wikidot is currently using v3.2.1.

 ...  ...

At this point, I think you'll have to add your own custom classes to do the stacking.

Forum category: Wikidot Integration / Nice to have
Forum thread: Stacking FontAwesome Icons?

Stacking FontAwesome Icons?

Sun, 23 Nov 2014 19:06:33 +0000

Hi!

Can I stack FontAwesome icons in Wikidot Bootstrap like this? If I can, how?

Thanks!

Forum category: Wikidot Integration / Nice to have
Forum thread: Stacking FontAwesome Icons?

Re: Ability to use default Bootstrap Javascript "Components"

Mon, 13 Oct 2014 20:21:41 +0000

You can use a basic form of tooltips by using James Kanjo's inline hovertips. If you are using the Standard Theme, then this will already be done for you. Otherwise, you would need to add the following CSS:

/*  Inline Hovertips by James Kanjo (!INHV)
==============================================================================*/
.hover{
    display: inline-block;
    background: none;
    height: 1.42857em;
    margin-bottom: 3px;
}
.hover:hover{
    background: url('http://css.wikidot.com/local--files/theme:standard-theme/hovertipBelow.png');
    background-repeat: no-repeat;
    background-position: center calc(1.42857em - 2px);
    height: calc(1.42857em + 3px);
    margin-bottom: 0;
}
.hover span{  transition: none; }
.hover:hover span{
    border: none;
    background: rgba(20, 20, 20, .95);
    font-size: 12px;
    min-width: 200px;
    color: #FFF;
    border-radius: 4px;
    padding: 4px 12px;
    margin-top: calc(1.42857em + 6px);
}

Forum category: Wikidot Integration / Nice to have
Forum thread: Ability to use default Bootstrap Javascript "Components"

Re: Ability to use default Bootstrap Javascript "Components"

Sun, 12 Oct 2014 09:28:38 +0000

Bootstrap Tooltips and popovers would be useful in many cases. Could it be possible to use them with Wikidot somehow?

Forum category: Wikidot Integration / Nice to have
Forum thread: Ability to use default Bootstrap Javascript "Components"

I would like to test Layouts and Bootstrap

Fri, 10 Oct 2014 18:35:38 +0000

I do have to tell you though I am a total virgin when it comes to any of this stuff . But I love to learn and thats why Im here. Thank you.

Forum category: Hidden / Per page discussions
Forum thread: Wikidot Modules

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 15:26:05 +0000

The solution could be to update wikidot FontAwesome to 4.2.

Is this something that site owner should do or is it somewhere deeper in Wikidot? If it's something that only Wikidot can do, can you say when you are planning to update it?

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 13:35:46 +0000

Its because there are 2 font files loaded and wikidot (3.2.1) is at first place.
When I'v deleted this code from page:

using firebug. All icons appears. The solution could be to update wikidot FontAwesome to 4.2.
Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 11:51:39 +0000

I added two working icons on the test site.

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 11:23:13 +0000

Oh really? That's odd… wouldn't have expected it to. Any screenshots? :)

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 10:30:31 +0000

The strange thing is that some icons actually show up on Firefox.

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 10:21:01 +0000

There's a (security) requirement in Firefox that requires that the web font files be requested from the same domain as the originating webpage request. Unfortunately, the way that Wikidot currently includes Font Awesome from the www.wikidot.com domain (it's hardcoded).

I have reported this as a bug here

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Some FontAwesome -icons not showing on Firefox

Fri, 26 Sep 2014 08:32:39 +0000

Hi!

I originally posted this at the community forum, but this might be a bit more appropriate place.

Some FontAwesome icons are not showing when using Firefox (tested on versions 23.0.1, 32.0.2 and 32.0.3). With Chrome they appear correctly (I haven't tested other browsers yet).

Example here: http://fontawesome.wikidot.com/

Any idea what might be causing this?

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Some FontAwesome -icons not showing on Firefox

Re: Carousel Image Slider

Sat, 30 Aug 2014 22:30:19 +0000

I just added some CSS that gives us a fade transition option for carousel. I updated the demo page so you can see it in action. The "How to Extend Twitter Bootstrap’s Carousel Functionality" article I found that inspired this has some other interesting tweaks for the carousel.

I haven't messed with other transitions too much yet, but it should be fairly easy to extend the choice of carousel transitions in a similar fashion since it's all done via CSS transitions and does not require access to the javascript.

Any chance you'll plug a transition attribute into the CSI, Timothy?

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: Modals :D

Tue, 19 Aug 2014 03:30:23 +0000

Thanks Ed!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Modals :D

Mon, 18 Aug 2014 19:26:07 +0000

OK, it looks like the modal-sm and modal-lg classes are not in Wikidot's base Bootstrap 3 CSS. I just looked it up in Bootstrap 3.2 and found what we're missing:

@media (min-width: 768px) { .modal-sm { width: 300px; } } @media (min-width: 992px) { .modal-lg { width: 900px; } }

[edit: Site custom CSS updated with the change] For now, I just added it to a CSS module on the demo page so you can see it in action. The default width is 600px, so you can see that the Bootstrap devs just changed the width by 300px up and down and set it up so it only kicks in at certain screen width levels.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Modals :D

Mon, 18 Aug 2014 17:23:34 +0000

Hi Ed!

I tested your suggestion but didn't succeed. Could it be possible that the different sized modals aren't included to the code?

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Modals :D

Sun, 17 Aug 2014 17:17:40 +0000

I think all you need to do is change the class from modal to modal-lg. I can't test at the moment but will play later if others don't beat me to it.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Modals :D

Sun, 17 Aug 2014 16:44:44 +0000

Hi all!

Looks excellent! There are different sizes of modals available in Bootstrap. Is it possible to choose the modal size in Wikidot? The default size here is a little bit too small for my intention.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Carousel Image Slider

Sun, 10 Aug 2014 13:48:46 +0000

Nice work!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: Carousel Image Slider

Sun, 10 Aug 2014 04:55:12 +0000

And now there's a working CSI (:

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: Minimal Login Status

Sun, 06 Jul 2014 14:52:52 +0000

Finally got this sorted out through the discussion on the feedback site.

This does not work (or any variants that use "local—code" syntax):

@import url('http://css.wdfiles.com/local--code/cssnippet:minimized-login-status/code_');

This does:

@import url('http://css.wikidot.com/cssnippet:minimized-login-status/code_');

I have updated the CSS here using the working syntax.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Minimal Login Status

Re: Minimal Login Status

Sat, 05 Jul 2014 22:59:04 +0000

I think the "No valid codeblock found" issue is going to be a tough one for the devs. The way a data form page is saved, it just has the filed names and data. For example, the minimized login status page is stored as extar line breaks added for readability):

author: 'Wikidot Community' summary: 'Minimalizes the Login Status so that it only shows the user''s avatar and behaves like a button.' description: "Essentially, this will transform the login status from:\n\nto:\n\nThis can be used for those who desire a less obtrusive form of the login info. Minimized to just an avatar, it is still easy to tell if you are logged on while preserving the your personalization. Simply clicking on the avatar reveals the typical list of account options.\n\nAdditionally, when logged out, the login status shows an image representing the sign-in action instead.\n\nIn order to use this with a custom layout, you must define the login status module with the following:\n\n[[code type=\"html\"]]\n\n [[module LoginStatus]]\n
\n[[/code]]\n\nThis CSSnippet is compatible with [*http://standard-template.wikidot.com the Bootstrap Standard Template]." code: "/** Minimalized Login Status\n * Developed by the Wikidot Community\n * \n * Minimalizes the Login Status so that it only shows the user's avatar and\n * behaves like a button.\n * ***************************************************************************/\n \n/* * When Logged In * */\n.login-status .printuser{ font-size: 0; }\n.login-status .printuser img.small{\n max-width: 20px !important;\n padding: 0 !important;\n background-image: none !important;\n width: 20px;\n height: 20px;\n border-radius: 10px;\n}\n \n.login-status .btn{\n background: none;\n border: none;\n padding: 0;\n}\n.login-status .btn.disabled{\n position: relative;\n left: 23px;\n top: 4px;\n z-index: 50;\n}\n.login-status .btn.dropdown-toggle{\n width: 28px;\n height: 28px;\n border: 1px solid #E3E3E3;\n border-radius: 14px;\n z-index: 49;\n}\n.login-status .btn.dropdown-toggle:hover{\n background: #EEE;\n border-color: #D7D7D7;\n}\n.caret{ visibility: hidden; }\n.login-status ul{\n left: -102px;\n border: 1px solid #DDD;\n box-shadow: 0 2px 3px -1px rgba(0,0,0,.2);\n border-radius: 5px;\n}\n.login-status ul .divider{ display: none; }\n.login-status ul li i{\n margin-right: 10px;\n}\n.login-status .printuser-show{ display: none; }\n \n/* * When Logged Out * */\n.login-status .login-status-create-account,\n.login-status > span{\n display: none;\n}\n.login-status .login-status-sign-in{\n background: #FFF;\n border: 1px solid #E3E3E3;\n width: 28px;\n height: 28px;\n border-radius: 14px;\n color: #000;\n font-size: 0;\n padding-top: 2px;\n}\n.login-status .login-status-sign-in::before{\n font-family: 'FontAwesome';\n font-size: 16px;\n content: 'ï‚';\n}\n.login-status .login-status-sign-in:hover{\n border-color: #D7D7D7;\n background: #EEE;\n}" example: ''

There's no [[code]] blocks like there are in the source of standard pages.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Minimal Login Status

Re: Minimal Login Status

Sat, 05 Jul 2014 22:24:23 +0000

I found 2 problems. Maybe it was something Timothy did. ;-)

The class name being used in the BS layout was "loginStatus", but it looks like it was changed to "login-status" when it was moved to the CSS site.

Adding fuel to the fire, it appears that rendering a code block via data forms does not work.

I'm copying the login-status css back to the main css page here until this gets sorted out. I edited the layout to use "login-status" for the class name.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Minimal Login Status

Re: Minimal Login Status

Sat, 05 Jul 2014 21:44:56 +0000

Something broke this recently. Any idea what happened? I know Timothy has been busy working on the migrating Bootstrap stuff to the CSS site, but I don't think it's related.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Minimal Login Status

Re: FontAwesome Editor Toolbar

Thu, 26 Jun 2014 01:52:55 +0000

Well, it should go from

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: FontAwesome Editor Toolbar

Accordion Panels

Sat, 21 Jun 2014 16:07:41 +0000

I just added a demo page showing how to use "accordion" (collapsible) panels with Bootstrap. The demo also explains the new (yet to be documented) feature that Wikidot now supports user-defined IDs in our code! That's something many of us have wanted and it's especially important for use with Bootstrap. It makes using the javascript enhancements that Bootstrap provides pretty straightforward.

Accordion Demo

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Accordion Panels

Re: FontAwesome Editor Toolbar

Wed, 18 Jun 2014 02:07:37 +0000

Sorry, what's the difference?
Does it look different?

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: FontAwesome Editor Toolbar

Re: FontAwesome Editor Toolbar

Thu, 12 Jun 2014 15:37:52 +0000

It's, (here it comes!)…, awesome! ;-)

I vote for plugging it into the main css here.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: FontAwesome Editor Toolbar

FontAwesome Editor Toolbar

Thu, 12 Jun 2014 15:30:48 +0000

I decided to update the editor toolbar to fit more in line with Bootstrap themes by using FontAwesome icons. You can see the result here!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: FontAwesome Editor Toolbar

Re: Carousel Image Slider

Thu, 12 Jun 2014 15:28:06 +0000

Looks Good!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: Carousel Image Slider

Thu, 12 Jun 2014 13:00:01 +0000

I found the issue with the navigation overflow. The parser is inserting

between the anchor tags that make up the left/right nav sections. That creates the extra line that's allowing the navigation shadow to spill out below the image area. Putting both the left/right navigation elements on the same line solved the problem.

Before

[!-- Carousel nav --] [[a class="carousel-control left" href=".myCarousel" data-slide="prev"]] [[span class="icon-prev"]]@< >@[[/span]] [[/a]] [[a class="carousel-control right" href=".myCarousel" data-slide="next"]] [[span class="icon-next"]]@< >@[[/span]] [[/a]]

After

[!-- Carousel nav --] [[a class="carousel-control left" href=".myCarousel" data-slide="prev"]][[span class="icon-prev"]]@< >@[[/span]][[/a]][[a class="carousel-control right" href=".myCarousel" data-slide="next"]][[span class="icon-next"]]@< >@[[/span]][[/a]]

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: Carousel Image Slider

Wed, 28 May 2014 23:49:57 +0000

It's beautiful (: This may prove useful for a future project of mine, so thank you very much for sharing!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: A lot of skrollr :)

Tue, 27 May 2014 08:24:55 +0000

There's no mobile version yet at all. It looks like crap now on my iPhone :)

Forum category: Bootstrap / Example Sites
Forum thread: A lot of skrollr :)

Re: A lot of skrollr :)

Tue, 27 May 2014 04:50:31 +0000

Very cool, although I first looked at it on my phone and it wasn't impressive. Then I looked at it on my PC and saw what you've created. It looks like it was a ton of work!

Forum category: Bootstrap / Example Sites
Forum thread: A lot of skrollr :)

Carousel Image Slider

Tue, 27 May 2014 04:20:43 +0000

I just created a sample page showing how to use the Bootstrap 3 Carousel slider using Wikidot markup.

I had been working on the assumption that it wouldn't be possible without some help from the devs because according to the BS3 docs, the target element had to be set up with an ID.

But, "Au contraire, mon capitan!"

It also works with classes for targeting the container!

Carousel Demo

I just have one small issue to work out with the navigation shader spilling out the bottom of the slide container.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Carousel Image Slider

Re: A lot of skrollr :)

Mon, 26 May 2014 15:16:52 +0000

The animation looks especially well if you click the middle mouse button and let it auto-scroll down the page gradually (:

Forum category: Bootstrap / Example Sites
Forum thread: A lot of skrollr :)

A lot of skrollr :)

Mon, 26 May 2014 11:36:07 +0000

This is an example site I just have made to one of our clients. BS3 + Skrollr + a lot of prototyping. And this is just a timeline chart for the animations:

https://www.evernote.com/shard/s108/sh/37f7c552-4d5b-44ce-ae79-d3e8e69bfa55/9a2c4f8bb7a0d5f3a37fba5b7f04df1c

http://wytwory.wikidot.com/

Forum category: Bootstrap / Example Sites
Forum thread: A lot of skrollr :)

Re: Modals for a Blogging

Thu, 01 May 2014 07:17:52 +0000

Wow! My avatar is rendered right top here! Means in a short time thjs will be on main site too.

written on mobile phone..

regards helmut

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals for a Blogging

Re: Modals for a Blogging

Thu, 01 May 2014 03:54:57 +0000

Ed, you make websites sexy.

Now I need a shrink to cure me of being aroused by quality web designs.
Thanks for adding a new financial burden to my life.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals for a Blogging

Re: Modals for a Blogging

Wed, 30 Apr 2014 15:51:27 +0000

Sorry James,

There was some drama with the site last week that forced my client to take down the site temporarily. When we reopened, it should have been set to "closed", not "private". It should be viewable now.

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals for a Blogging

Re: Modals for a Blogging

Wed, 30 Apr 2014 14:47:43 +0000

Private site? Seems like I can't see any images :/

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals for a Blogging

Modals for a Blogging

Tue, 08 Apr 2014 01:03:01 +0000

After setting up a new site for a client who is going to do some blogging, I thought might be cool to use modal popups for the "read more" links on his home page versus navigating to a new page. I think it works quite well and is especially nice on a phone. Here's the code I used. We're using a data form for creating the blog entries in an autonumbered category. Autonumbering works perfect for constructing unique class names for each modal created on the fly by ListPages.

By using ListPages and the Modal dialog code that tsangk turned us on to, I think you get a really nice result. A live example is here (the link might go away later, so if I forget to edit this post, let me know).

Note: for reasons I haven't totally figured out yet, I had to add the css module. The default position for modals is left: 50%; and it didn't position correctly on my 2 column page layout without resetting it to zero.

[[module css]] .modal-dialog { left: 0; } @media screen and (min-width: 768px) { .modal-dialog { width: 700px; } } [[/module]] [[div class="row"]] [[div class="col-sm-8"]] [[module ListPages category="blog" separate="false" limit="5" order="_originaldate desc" tags="+_home +_active"]] [[div class="panel panel-info"]] [[div class="panel-heading"]] [[div class="panel-title"]] [[date %%form_data{originaldate}%% format="%B %d, %Y"]] + %%title%% [[/div]] [[/div]] [[div class="panel-body"]] %%form_data{summary}%% [[div class="pull-%%form_raw{imageposition}%%" style="display: none%%form_data{imagefile}%%;"]] [[image %%form_raw{imagefile}%% class="img-responsive img-center"]] [[/div]] [[a data-toggle="modal" data-target=".wikidot-bs-modal%%name%%" class="btn btn-primary btn-lg"]]Read More[[/a]] [[div class="modal fade wikidot-bs-modal%%name%%" tabindex="-1" role="dialog" aria-labelledby="Modal%%name%%" aria-hidden="true"]] [[div class="modal-dialog"]] [[div class="modal-content"]] [[div class="modal-header"]] [[a class="close" data-dismiss="modal" aria-hidden="true"]]@<×>@[[/a]] [[date %%form_data{originaldate}%% format="%B %d, %Y"]] + %%title%% [[/div]][!-- /modal-header --] [[div class="modal-body"]] %%form_data{summary}%% [[div class="pull-%%form_raw{imageposition}%%" style="display: none%%form_data{imagefile}%%;"]] [[image %%form_raw{imagefile}%% class="img-responsive img-center"]] [[/div]] ~~~~ %%form_data{readmore}%% [[/div]][!-- /modal-body --] [[div class="modal-footer"]] [[a class="btn btn-default" data-dismiss="modal"]]Close[[/a]] [[/div]][!-- /modal-footer --] [[/div]][!-- /modal-content --] [[/div]][!-- /modal-dialog --] [[/div]][!-- /modal --] [[/div]] [[/div]] [[/module]] [[/div]][!-- /col-sm-8 --] [[div class="col-sm-4"]] [[div class="panel panel-warning"]] [[div class="panel-heading"]] [[div class="panel-title"]] FinleyPR Blog + Recent Posts [[/div]] [[/div]] [[div class="panel-body"]] [[module ListPages category="blog" separate="false" limit="5" order="_originaldate desc"]] * %%linked_title%% - [[date %%form_data{originaldate}%% format="%B %d, %Y"]] [[/module]] [[/div]] [[/div]] [[/div]][!-- /col-sm-4 --] [[/div]][!-- /row --]

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals for a Blogging

Re: Modals :D

Wed, 26 Mar 2014 06:20:15 +0000

Ah! That's cool! Didn't try putting any modules in it, so I'm quite surprised how well that turns out!

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

Re: Modals :D

Wed, 26 Mar 2014 06:16:13 +0000

Wow! I'm officially an idiot for waiting 5 months to look at this closely. I just made a demo page to see how well it handles Wikidot markup in the body and it's perfect.
Modal Tests

It works especially well on phones (at least it does on my Galaxy S4)

Forum category: Wikidot Integration / Wiki Markup and Examples
Forum thread: Modals :D

installing bootstrap

Sun, 23 Feb 2014 21:30:26 +0000

Hi people!

I'm new in wikidot, and a bit less to programing. but I'm practicing.
I would like to build a wiki website that would function mostly on mobile devises.
I have already started playing with the css and html of the website I've started to build but figured out that it's not mobile friendly..

my question is how to install bootstrap?
on the 'Layouts and Bootstrap in Wikidot' it said:
"When creating a custom CSS theme, form now on, users may choose Bootstrap to be loaded " - i can't see this option
should i just copy past the code into my css?
i think i want to start from scratch. where do I start?

Forum category: General Discussion / The Lounge
Forum thread: installing bootstrap

Re: Page Tags Issue

Tue, 14 Jan 2014 14:34:02 +0000

Reporting a problem with the solution … You rock!

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Page Tags Issue

Page Tags Issue

Thu, 09 Jan 2014 19:59:00 +0000

I just posted this as a bug on the Feedback site, but wanted to add the info here in case you're not watching the Feedback site.

I noticed that tags we being displayed without any space between tags and upon investigating found that [[tags]] does not render the full HTML markup in Bootstrap layouts. I was able to fix it by changing my layout to include the missing markup and I was then able to add the CSS styles (also missing from the Bootstrap base CSS). These are the edits I made to the layout and CSS on this site.

Layout Before

 [[if tags]] [[tags]] [[/if]]

Layout After

 [[if tags]]  [[tags]] 
 [[/if]]

Missing CSS Added

/* Page Tags Default Styling */ .page-tags { clear: both; margin: 10px 0 0; padding: 0 2px; text-align: left; } .page-tags a { margin: 0 3px; } .page-tags span { border-top: 1px solid #BBBBBB; font-size: 85%; padding-top: 2px; }

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Page Tags Issue

Re: Customising Legacy Layouts

Sun, 05 Jan 2014 15:38:03 +0000

Good stuff, James. You were a busy boy!
I'm looking forward to applying your handiwork to one of my sites. One of my longtime annoyances was having the search box and login status trapped inside the header.

Forum category: Wikidot Integration / Custom Layouts
Forum thread: Customising Legacy Layouts

Customising Legacy Layouts

Sun, 05 Jan 2014 05:01:20 +0000

It's pretty cool that the Wikidot layout is now customisable — But as we can't use IDs in our customisable code, we can't actually customise the legacy layout and preserve customised CSS for it.

I've created a legacy section on this site which will help users to "upgrade" their legacy layouts to customisable ones without additional programming.

I have achieved this by:

Upgrading legacy CSS themes to compatible ones (Emulated Legacy CSS)
Emulating the legacy layout (Emulated Legacy Layout)
Creating a JavaScript CSS converter (Legacy CSS Upgrade Converter)

There is a known issue where Wikidot's base CSS doesn't seem to include the button GIFs in the editor, however I'm not prepared to look into resolving that issue. If others are willing, I recommend appending the CSS fix to the Emulated Base CSS.

Feel free to test this with your own sites. I know that I'd probably enjoy using my existing layouts but moving the editor to above the page content instead of below it :-)

Forum category: Wikidot Integration / Custom Layouts
Forum thread: Customising Legacy Layouts

Bootstrap on Print Pages

Sun, 29 Dec 2013 15:28:58 +0000

Printer-friendly pages of bootstrap pages do not have Bootstrap applied; it would be nice if it did (:

Forum category: Wikidot Integration / Nice to have
Forum thread: Bootstrap on Print Pages

Re: Breadcrumb not working? Missing module?

Thu, 28 Nov 2013 14:51:38 +0000

Thanks Ed, it looks fine!

Forum category: Wikidot Integration / Bugs and Other Weirdness
Forum thread: Breadcrumb not working? Missing module?