Discussion on TheShots - Responsive Image Listing Template


TheThemeio does not currently provide support for this item.

31 comments found.

I really like this theme. I also like the ui elements included with thejobs theme. Is there a similar list of elements for this theme as there are at this link: http://shamsoft.net/thejobs/page-ui-elements.html

Glad to hear that. Not actually like thejobs and as complete as it, but you can see a list of them here: http://shamsoft.net/theshots/doc/

Hi I would like to know how can I modify lightSlider speed (transition-duration:400ms to 600ms) thru code?

(the slideshow located at index2 file)


You need to destroy the previous slider and create new one using your own options and place it inside custom.js file. Put the following code inside your custom.js to achieve speed of 600ms:
  item: 1,
  auto: true,
  loop: true,
  slideMargin: 10,
  controls: false,
  pauseOnHover: true,
  speed: 600

Are you including the landing page? Thks.

Hello, First, thanks you for that great theme ! I’m working on integrating it on a website and i’m working with chrome and firefox. I tested it on IE an it appears that on that browser, the topbar, menu, etc has a little animation, like a slide down on the screen. Can you give me a clue on removing it? Have a good day

Thank you for the fix, unfortunately it was no enough “brutal” ! So i mixed it with another css anim removal css (see below),This css has to be the last thing in head tag, enclosed by style tags + put the preload class in HTML tage rather than body. So far, it works fine :)

.preload * {
 /CSS transitions/
 -o-transition-property: none !important;
 -moz-transition-property: none !important;
 -ms-transition-property: none !important;
 -webkit-transition-property: none !important;
 transition-property: none !important;
 /CSS transforms/
 -o-transform: none !important;
 -moz-transform: none !important;
 -ms-transform: none !important;
 -webkit-transform: none !important;
 transform: none !important;
 /CSS animations/
 -webkit-animation: none !important;
 -moz-animation: none !important;
 -o-animation: none !important;
 -ms-animation: none !important;
 animation: none !important;

but some glitch still appears and for no reason, soemtimes it doesn’t work perfectly. Best thing would be to remove thoses animations in the css itself rather than “bypassing” them

If you want to remove the animation, you can add following code to your css file:

.navbar .logo img,
.user-account .dropdown-toggle,
.user-account .dropdown-toggle img {
  transition: none;

.nav-menu a {
  transition: color .2s linear;
<pre /></pre>

When I try to upload this theme I get the following error message:

“The package could not be installed. The theme is missing the style.css stylesheet. Theme install failed.”

I unzipped the file I downloaded from Envato and I can’t locate any other zipped folders within the unzipped download.

How do I go about fixing this error?

As you stated in your refund request, it’s not a Wordpress template. We accepted your refund request.

Hi! The responsive menu doesn’t work.

I tryed upload the original folder “theme” and doesn’t work too.

I don’t know what hapens, some days ago works good.

Thank you


What’s the problem? It works fine in our demo: http://shamsoft.net/theshots

Hello. I recently buyed this template and now I am trying to make it live :) :) but I have some issues with it to be precise with dropzone and some stuff. I would like you to send me a clean version of js files and css files since both of them that are included are minimized one so I am just messing aroung and cant do anything.

Hello, that’s great. Would be nice to see it online :)

app.css and app.js are not minimized. Only vendors which is in top of the files are minified, and the rest of files are unminified.

Also, if in the downloaded package go to source/src/assets/css you can see SCSS files and theshots.css . theshots.js is located in source/src/assets/js.

Ok here is the thing.. I would like if you can help me to clean all js except mobile menu, move to top button, and on scroll to get smaller header. can you help me with that?

I strongly don’t recommend it! The JS file of theshots template is 2kb minified, even if you remove half of the code, it becomes 1kb which doesn’t make any sense, because they are necessary for other parts. If you are worried about app.min.js which is 250kb, I should say it contains jQuery, Bootstrap, gallery, dropzone, etc. which is also necessary for this template. So you shouldn’t remove anything, otherwise you’ll encounter several js errors!


I love your theme, seriously! Great job!

I am just wondering about a few questions before purchase. app.min.js apparently includes several JS libraries. What if I wanted to update Jquery? Bootstrap? As I have those already included in my current project?

Next question, Dropzone.js’s development stopped, so are you planning on including a different JS file upload library? Like Blueimp’s jQuery-File-Upload? It is much lighter than Dropzone and it seems like you are using their Gallery already.

I would love to hear a response from you regarding these questions and updates in general (like Bootstrap 4?) etc.

Thank you for this great piece, Chris


Thanks for your interest.

At first, we thought it would be better for customers to receive updates of jQuery, Bootstrap, etc. from us. So we can make sure that TheShots is compatible and stable with those updates. But if TheShots is part of a larger project which already includes jQuery and Bootstrap, you are still able to import only theshots.js and theshots.css; they are included in package after purchase. Also, make sure that you will include other dependencies as well. They are located at “source/src/assets/vendors” directory.

I think it’s not a good idea to change the uploader at this stage. Since other customers are currently use this plugin in their production, moving from Dropzone.js to another uploader would be a breaking change for them. This would be a good idea for version 2.0, but we don’t have any plan to release another major version.

Bootstrap 4 is another breaking change which requires us to move to version 2.0. So we probably stick to Bootstrap 3.3.

Thank you.

Thanks for the response. Now that I got to the part of implementing the design, I chose to go with TheShots!

I agree, to change everything at once, it might not be the best idea. I would love to see some future updates on this though!

Thanks for choosing us. We hope you find the code quality as high as your expectations.

Hello, thanks a lot for your wonderful theme ! Please can you tell me how to remove transparency in the lightslider ? (same as mouveover… but all the time…)

Hello, thanks for purchasing it.

To remove transparency from the gallery items, add the following code to your css file:

.lSSlideOuter .lSPager.lSGallery li {
  opacity: 1;

Hello, there’s a frustrating issue with the user dropdown menu (on the nav bar). When the mouse leaves the avatar area, the dropdown disappears immediately, leaving many users frustrated as the menu disappears when they try to go diagonally from the avatar to the first menu item.

Can you let me know how to add a closing delay to the menu so that it closes after a few ms and not immediately? Thanks.


The menu is based on the user’s mouse hover. If you need to add more delay, we have to use javascript for this purpose which is not an optimal approach. We’re not planning to change this behavior, since it’s a standard way of implementing a hover dropdown. If you still want to change it, you can learn how to do it here: https://css-tricks.com/dropdown-menus-with-more-forgiving-mouse-movement-paths/


I bought the frameword and I am very satisfied.

by the way I encountered a problem when uploading files, in fact it does not work perfectly with angular (one page), if I change page then I return to the initial page, the display of files is not done not correctly.

Thank you.


It shouldn’t be from the template side. Sounds like something is wrong from your angular or backend code.



I added a bootstrap accordion, but it does not work. is the library compatible with bootstrap?

if I include Jquery at the end of the file it works but generates other errors.


Maybe you did something wrong, because we have Bootstrap accordions sample on our demo and it works just fine: http://thetheme.io/thesaas/uikit/accordion.html