Hi there, need some guidance. with the agency layout under the "work section", id like to have my images cover up this entire section and be able to scroll through easily. I've eliminated the background image successfully but my images never cover up this entire portion. will be gratefull
Are you trying to replace the images in the slider itself or within the modals? Let me know, or email me using the form on this page: https://wrapbootstrap.com/user/StartBootstrap
how i wish you could send me mail so as i can send you illustrations of what I meant. I know I've failed to make a clear explanation on this
Did you send a message to https://wrapbootstrap.com/user/StartBootstrap? If so please send it again and I can see the images. Thanks!
Is there a way to scroll/toggle/click next in the portfolio items on a page. And use the left and right arrows for all the portfolio items. It's such a headache to click and close everytime. It would also be great pressing ESC would close out as well.

Currently each portfolio preview in the large portfolio carousel is a modal window of it's own. I will explore this functionality for the future though. In the meantime you can try to bind up the magnific popup plugin with the slider instead to see if that gets you what you want. If you customize the lightboxes to look like the current modals and don't auto-play the slider then you should be able to get this sort of functionality.

Hopefully this helps!
Is there a way to get the "our team" portion to tighten up to only two images and have them centered?
You can modify the owl carousel plugin to make this happen, just set the number of images to 2!
Hi ! I have purchased your theme ! Very cool ! I have a question about "portfolio section"
I would like to have big thumbs like this http://ironsummitmedia.github.io/startbootstrap-creative/

How can I do ? Impossible to enlarge pictures :(

Help me please !
The pictures on the portfolio in Vitality are set using the isotope grid structure. You can try to make them larger by removing the container element, removing the margin from each image, and then reducing the percentage size of each image in the CSS to allow for more images in each row. This is how you could accomplish that effect.

Otherwise, if you didn't want to have sortable items, you could just grab the code from the free Creative theme on Start Bootstrap and work that into the Vitality theme.

Hopefully this helps! Thanks for choosing Vitality!
Hi! ohmygosh I know there must be something super simple I am missing, but I have vitality, never had issues with swapping photos before, but even though everything is perfect in the browser when working, when I upload to the site I get the broken photo picture and no photos - what did I miss?
I am using 1.3.5
The best thing I can say to try is to double check your file paths and make sure they are correct. For example, when I go to http://veryvancouverchristmas.com/assets/img/bg-header.jpg I get a 403 forbidden error. Are you storing the images somewhere else? There might be some security permissions on your web host that is giving that error as well. Hopefully this helps!
Got it thank you! ;-) Happy weekend!
Hey there,

I bought your theme and itś really a great theme. However when i try to add two portfolio sections on one page. I can seem to get this working. U guys used the mixitup.js script. And i already had a look there but i still couldnt fix the issue. Some code with two mixitup filter wil do:)
Thanks in advanced nice theme:)!

greetings anno
If you're adding a second portfolio make sure you are using a custom ID and that you're referencing the new ID in the jQuery within the vitality.js file. Hopefully this helps! Have a great day!
nisagu66 PURCHASED

I just bought Vitality. However i want to know how can i edit the contact me form in order to receive mails. I edit the php? or the contact_me.js? Or both?
Where should i write the mail i want to receive mails from.

And another question, if i want to work the page in spanish, i should translate all the input into spanish?

Yes in the docs you will see a quick guide on how to set this up. If you got to the mail/contact_me.php file you'll see the email address field near the bottom of the script that you need to change to your email address and that will allow you to use the form. Hopefully this helps!
Hello, Thanks for the work on the theme! It works really well.

I am trying to get the carousel working with just one item (later to expand to more as my team expands), but I seem to be missing something. But the one item is always set to the left, not centered. My owl.carousel.js settings are:

items : 1,
itemsCustom : false,
itemsDesktop : [1199, 1],
itemsDesktopSmall : [979, 1],
itemsTablet : [768, 1],
itemsTabletSmall : false,
itemsMobile : [479, 1],
singleItem : false,
itemsScaleUp : false,

Result image: https://www.dropbox.com/s/8em7qyjh8lm35he/Screen%20Shot%202015-11-26%20at%208.19.15%20AM.png?dl=0

If I set singleItem to true I get: https://www.dropbox.com/s/mtz9h2g3snbw4cq/Screen%20Shot%202015-11-26%20at%208.23.20%20AM.png?dl=0

My html code is: https://www.dropbox.com/s/lhnc0nmvx1nerky/Screen%20Shot%202015-11-26%20at%208.21.58%20AM.png?dl=0

Do you have any suggestions?

When setting the image to 1, then the full width of the slider will be using the image, and in this case the text is being centered, but the image is not. If you can find a way to center the image within the div, or you can try to fix the width of the actual box somehow and you should get things lined up. Hopefully this helps!
Oh yes, thanks for the help! A simple center tag did the trick. Thanks!
Wonderful I am glad this worked!

I love this theme! But is there any way I can get the background video to work on iPad or mobile?

The non-video background on mobile is intentional actually. Loading a video file on mobile devices is usually pretty slow. Disabling the background video on mobile devices is actually part of the plugin that run the video itself. If there is a way to use some sort of smaller-sized animation or something like that as a background video then that might be an option, but I haven't looked into it. Typically, it's recommended to just set a image file as your fallback image for mobile devices. Thanks for choosing Vitality!
Thanks - is there a way to enable it for tablet size even if not necessarily for mobile? Is it using screen size break points? My reason being that the majority of tablet users are on WiFi rather than 3G mobile, and 4G mobile has no problem with video (my file is only around 1MB anyway). If I could get it working on medium screens (tablets) it would be perfect, and I can use the image fallback for mobile. Is there something I can change in jquery.fs.wallpaper.js?

Thanks again!
It looks like I can change the 'isMobile' var - this won't pick up the screen size but will enable me to do some testing :)
That is a good start. Also, if you download the updated version of the template, Formstone changed their 'Wallpaper' plugin to just be called 'Background' and there might be some more testing options in the new version. Otherwise just stick to the old docs and test away. Hopefully this helps!
Hi, I love Vitality template, however I have small issue with it. I would like to set portfolio grid in a way that when I click button ALL, then I will see only first image from each category. Since I have quite a lot images in all categories (site looks a bit messy when clicked ALL). And when click on particular category, for example IDENTITY, then all items of this category will be seen. Is this possible please.
Thank you for kind help. Micro
Hmm unfortunately I am not quite sure how to do this one without a hack of sorts. What you could do is create a separate category and have that as the default display, something like 'landing' or 'default.' After that you could make those items clickable as sortable items and have the rest of the portfolio sort that way. Another way to do it would be to replace the buttons that are used to sort with the images that you want and have the portfolio set to display nothing until something is clicked. Those are two possible options, hopefully this helps!

I've purchased and built out your vitality theme.

It's phenomenal.

But I'm having one problem occurring on mobile only:

The logo images for the carousel appear then disappear.
Often times it's all of them or one or two, but the client logo images are disappearing on showing an empty white square.

My website is: www.jrossmedia.com
And the problem appears to only be occurring in Safari. Chrome mobile hasn't had the problem in all my tests.

Thank you for your help!
Thanks for choosing Vitality!

I am unable to replicate the issue on Safari mobile on iPhone 6. I am testing it and the logos seem to be appearing as intended. What version of Safari are you running on your phone that you're having trouble with? I am thinking it might be some sort of issue with the retina.js plugin or perhaps the images are slow to load with a slower mobile connection...but you said they were showing a square? Let me know what version of Safari you're testing on and I can see if I can replicate the issue.
I have having trouble replicating it myself now, perhaps it was a hosting issue?

It appears fine now.

I have another issue though.
How do I make the Phone Number field in the contact form NOT required?

I cannot find a reference to "phone" in any of the JS Files.

Thank you for your help!
In the HTML look for the input for the phone number and you'll see the 'required' attribute being used directly in the HTML along with a data-validation attribute. I think you can just take the required attribute out and it should work.
Removing the "required" label didn't do it.
I removed that AND removed the validation message code (directly beside it) I removed that as well.

This allowed me to get past the validation and I even got a "successful message sent" message on the screen after submitting - BUT it did not send the email :(

I reverted it back and the test worked.

So something on the contact script must be changed to ALLOW for a message to be sent without phone number field population....that's my guess at least. We got it working on the HTML side, but now it needs to work on the form engine side.

Any ideas?

Thank you for your help.
In addition to removing the required label and the validation message code, you can try removing line 5 in the contact_me.php file that checks if the field is empty. That might be giving the false positive on the email send?
I am Hosting the PHP on my server and the email for the form isn't sending to the specified email. I have put in echoes and console logs in both the js and php files, the js responds but the php doesn't call even though i have linked it by this way "url: "././mail/contact_me.php""
Make sure the file paths are correct, but if they are then this might indicate an issue with the mail server that your web host is using. They might have a security or permissions feature that is preventing the form from sending messages.

Really happy with the template. On iOs and Android phones I want to get a fullscreen of the website's first page when opening the page on mobile devices, just like the desktop version.
How to do this?

The issue with making a fullscreen page on the opening screen on smaller devices is that if the content of the section is larger than the screen height then the content will go over. You can set a min-height to 100% for that header section though and it will be guaranteed to be at least full screen.

Really happy with the template. On iOs and Android phones I want to get a fullscreen of the website's first page when opening the page on mobile devices, just like the desktop version.
How to do this?


Really happy with the template. On iOs and Android phones I want to get a fullscreen of the website's first page when opening the page on mobile devices, just like the desktop version.
How to do this?

Hi, I have problems with the responsive on other devices that are not the laptop screen.

this is the site:

If you're putting the whole site in an iframe then the page will not respond correctly on mobile devices.
First of all, great theme!
I have a question though.
Is there any way to loop the video only a number of times?
I would like it to loop 4 times but can't figure it out myself.

Kind regards,
Unfortunately the plugin that is being used, the Formstone Background.js plugin, only allows for a true/false setting on the loop feature. Thanks for choosing Vitality!

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


Licenses: Details »

Single application $14
  • HTML Template
Bootstrap: Compatible with 4.x
  • Responsive
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Topic: Design & Creative Services
Labels: bold, bootstrap 4, clean, creative, minimal, modern, multipurpose, portfolio, sass, scss
Released:4 years ago
Updated:2 months ago
Sold exclusively on WrapBootstrap


Signed up 4 years ago

Need an admin template?

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 10/11
  • Latest Opera

Features & includes

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

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation