27 comments

Nice debut, ThemesCollective :)
Easy non-standard navigation, clean design. Good luck :)
Thanks 8Guild :)
itone PURCHASED
1) Don't scroll on touch devices (see internal pages)
2) How to turn off scrolling snap to sections?
Hi @itone, sorry about the dealy, WrapBootstrap doesn't let us know when comments are made.
Can you Explain more about the issue on touch scrolling?

TC.
For some reason your theme loads forever after being setup and there are no errors in the console. Any ideas?
Hi @kpjackson2, sorry about the delay, WrapBootstrap doesn't let us know when comments are made. We will check comments regularly from now on.

Have you purchased a copy of Columbia? I don't see a 'PURCHASED' tag on your username.

Do you have a link to your site, so I can take a look?

You can also contact us on help@themescollective.com.

TC.
Hi @themescollective, yes I did purchase a copy, not sure why there is no 'PURCHASED' tag. Seems like the images that I had in the slider where too big, so it took forever to render, I was able to fix the issue by decreasing the file sizes.

I am getting the same problem as a @itone on mobile devices as well. It does not scroll and the website is all distorted when navigating.
Hi @kpjackson2 - please forward me a link to your site online, (you can send to our support address for privacy if you prefer, help@themescollective), and I will take a look and see what's going on. Columbia was tested extensively across all mobile platforms before release, so we want isolate the issue you're seeing and understand whether it's specific only to your site, or whether we need to release an update.

Again, WrapBootstrap doesn't let us know when comments are posted here in the comments section, which is why you've had to wait 2 days for this reply. For instant support, you should contact us directly on help@themescollective.com

Regards,

TC.
ckn123 PURCHASED
This is a very nice design and I am considering purchasing it. I'm however concerned about the user experience in terms of the navigation (mystery meat).

1. Is there anyway to integrate a clear fixed navbar on the page with a highlighted page link for the page the user is on (breadcrumbs)?

2. Is there a way to integrate a hover section name for the dot navigation on the pages?

3. Is there a creative way to keep the brand image / name on all the pages?
Hi @ckn123, sorry about the delay; up until now, Wrapbootstrap didn't notify us when a question was left here, but they've just introduced this feature now for authors, so big thumbs up to them for that!

Answers to your question respectively;

1. You could indeed implement a fixed narbar to the pages, using the standard Bootstrap markup, (see getbootstrap.com for the proper semantic markup details), but currently we don't offer this design feature out-the-box.

2. Currently, we won't be offering this feature, but could be implemented fairly easily if you know how to write the extra code. There are js plugins out there which offer this.

3. Again, this would need to be an additional design feature that we can't offer at this time, however if you went ahead with a fixed narbar, (see answer #1), then you could include a set of breadcrumbs and company logo into this.

Unfortunately all three of those features you need would require us to change the overall design quite significantly, and isn't something we can go ahead with at the moment.

Regards,

TC.
ckn123 PURCHASED
I'm going to go for it with the ongoing sale. I will play with it and see if I can come up some kind of nav with logo on the bar like http://nclud.com

keeping fingers crossed.
Good luck!

TC.
noxgenus PURCHASED
I purchased this template last week, but I just noticed that scrolling does not work in Chrome on Galaxy Tab 2 and 3. There is no way to scroll except for the dots in the side menu...looks like some touch event is not working. Can you fix this please?
Hi @noxgenus, thanks for purchasing Columbia!

Apologies for the scrolling issue. We released a theme update 1-2 weeks ago that we thought addressed this issue, but obviously it's still present. I can see the problem you refer to and we will roll out another update in the next 24 hours to cover this.

Regards,

TC.
noxgenus PURCHASED
if someone else is looking for a quick fix on the Chrome scrolling issue in this template:

in style.css, change overflow-y: hidden; to overflow-y: scroll; on the html element

@media (min-width: 769px) {
html {
overflow-x: hidden;
overflow-y: scroll;
}
}
@noxgenus - yes this is indeed where this lies.

Note to others reading this: we've not test @noxgenus' fix for scrolling, but assume it is a valid solution. If you want to use this, then add @noxgenus' css fix to your custom.css file, but otherwise we will roll out an update in the next 24 hours.

To explain the problem some more: on larger screens, we turned off scrolling on the html and body tags using an 'overflow: hidden' attribute in css, to make way for the custom scrollbars using the nicescroll.js plugin. The custom scrollbars were then removed for smaller screens and organic scrolling should have come back into action.

Update coming in the next 24 hours.

Regards,

TC.
noxgenus PURCHASED
Thanks for following up on the problem...I've had a closer look and I understand why this issue was present, since it's a bit of a nasty one. Removing the overflow-y: hidden; indeed solves the scroll problem, but then the original scrollbars re-appear. Since there is no decent way to hide scrollbars except for using 'overflow-y: hidden;' , I had to use a very dirty webkit hack to set overflow-y: hidden; only for Chrome and Safari, then remove the scrollbar with 'html::-webkit-scrollbar { display: none; }'

So I'm very curious what your fix is going to be, mine wasn't pretty ;)
noxgenus PURCHASED
this is the dirty browser hack:

html {
width: auto;
overflow-x: hidden;
overflow-y: scroll;
}

@media (min-width: 769px) {
html {
overflow-x: hidden;
overflow-y: hidden;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm),
screen and(-webkit-min-device-pixel-ratio:0) and (min-width: 769px)
{
html {
overflow-x: hidden;
overflow-y: scroll;
}
html::-webkit-scrollbar {
display: none;
}

}
@nogenus Yeah that is quite dirty! lol
The scrolling seems to have a mind of it's own in the demos. I've tried Chromium and Safari. Is there a plug-in or something that can be disabled?

And this a *miner* thing... I think you mean "stood in awe" not "stood in ore."
Hi @Dgerton, before I can offer support you will need to provide proof of purchase. I don't see a 'Purchased' tag on your username. Please send your purchase code to me at help@themescollective.com.

If this is a pre-sales question please let me know.

Regards,

TC.

P.S I am not a miner.
sb1304 PURCHASED
Hi

There's an issue in IE (11.0.9600.xx) in the article slider. On hover over the image slides up and then jerkily cuts the top off. In chrome & FF the image slides up within it's container. Probably some IE hasLayout issue for the container..

Tested in demo on your site.

Thanks
Thanks for the notice, @sb1304. I'll take a look and act accordingly.

Regards,

TC.
sb1304 PURCHASED
Seems to be actually something the flexslider js is doing.

Quick dirty fix is to add css: #article-slider ul li > div { overflow: hidden; } on the col-xx divs.
Thanks again @sb1304, I'll have a scout to isolate what you're experiencing.

Regards,

TC.
sb1304 PURCHASED
Another issue is the contact form in IE. Using padding at values greater than line height drives the placeholder and content out of view. Chrome / FF handle it differently.

Have to use height & line-height instead and reduce the padding like the bootstrap input-lg class.

body#contact .form-control { //removed padding. transferred to below.
border: none;
font-family: 'Open Sans', Helvetica, Arial, sans-serif;
font-weight: 700;
text-transform: uppercase;
font-size: 14px;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
border-bottom: 2px solid #eee;
}

body#contact input.form-control { //new section
height: 48px;
padding: 10px 0;
line-height: 1.33;
}

body#contact textarea.form-control { //add padding & height
padding: 10px 0;
border-bottom: none
height: auto
}

I've use a smaller input height - yours is ~60px. You'd have to increase the line height, e.g. 1.5 for 54px etc

Stephen
The padding change for forms will be rolled out shortly - please stand by.

TC.

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$9
250Purchases

Licenses: Details »

Single application $9
Version:1.0.3
Type:
  • HTML Template
Bootstrap: Compatible with 3.2.x
Layouts:
  • Responsive
  • Fluid
Browsers:
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:No
Categories:
Tags: agency, clean, creative, minimal, personal, php contact form, slider, sortable portfolio, video
Item#:WB00106L4
Released:3 years ago
Updated:2 years ago
Sold exclusively on WrapBootstrap
themescollective

themescollective

Signed up 3 years ago

Need an admin theme?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 9/10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running: