• Registered: 2013-02-28
  • Posts: 116

Topic: Basic page config issue

I just updated Showkase Pro from 1.36 to 1.40 and some configuration on one page is now off... so far I'm only seeing the problem in Chrome browser. I believe I may have done something previously to correct this, although I really am not sure. When I go to http://djphoto.com/video/ the videos are not lining up properly on the page, one of them shows a partial area of it again and the page no longer scrolls. Can you please take a look and let me know if you see what may be causing this and how to correct? Thank you!

  • Registered: 2013-02-28
  • Posts: 116

Re: Basic page config issue

Actually I think I found a note I created a long time back about removing some code referring to: fitVids.js     Does this still apply? If so, can you please direct me to where to locate it?

  • Registered: 2012-12-16
  • Posts: 950

Re: Basic page config issue

Thank you for reporting this problem.
I have been able to replicate the problem in a test site of my own and I have notified the developers who will investigate further.
In the meantime, it looks like a possible workaround might be to remove the 'fitvids.js' script from your page (as you suggest). The video dimensions will no longer be responsive but the videos should no longer be cut in half.
If you just want to remove it from your 'Video' page, open the 'video/index.html' file in a plain text editor and remove the following code (near the bottom of the page).

<script src="/showkase/_themes/base/js/jquery.fitvids.js"></script>
<script>
    $("section.content").fitVids();
</script>

(Please note that if you edit the page and re-publish, the code will reappear.)

  • Registered: 2013-02-28
  • Posts: 116

Re: Basic page config issue

I found a notation from a long time back that was referencing making the same change you talk about, but to the "_themes/base/pagetypes/basetheme.tpl".  If I do it there will it not require me to change the code after each update?  Will it cause any other changes to happen throughout the site?

  • Registered: 2012-12-16
  • Posts: 950

Re: Basic page config issue

You could certainly remove lines 170-173 of the '_themes/base/pagetypes/basetheme.tpl' file which will prevent the 'fitvids.js' code from being included in all your Showkase pages (even after publishing).

<script src="{$ss_themesUrl}/base/js/jquery.fitvids.js"></script>
<script>
    $("section.content").fitVids();
</script>

The 'fitvids.js' code should affect only videos within Showkase pages so removing the code should have no other adverse effects. Just republish your site after removing the code and the 'fitvids.js' code will no longer be used.
Please note that the line numbers above refer to the current version of Showkase (v1.4.0.1).

  • Registered: 2013-02-28
  • Posts: 116

Re: Basic page config issue

I went with this latter suggestion because it seemed like a better workaround just because I won't have to worry about remembering to redo the code each time I update the site. It seems to be working fine (although unresponsively as you warned) now- thanks!

As I searched around through previous notes is where I found this way that you originally suggested back in March of 2015. I actually had forgotten about having this issue back then... until it happened again after this last Showkase update. Having said that, this appears to not be a new problem. Any chance that the developers will get to this anytime soon? Truly, I'm grateful that this works as an interim measure, but it would be much better if the videos did size responsively like the rest of the site.

  • Registered: 2012-12-16
  • Posts: 950

Re: Basic page config issue

Any chance that the developers will get to this anytime soon?

I'm sure they'll take a look as soon as they can (although, unfortunately, I don't have a timescale for you) and I'll post back here with any news as and when I have any.

Truly, I'm grateful that this works as an interim measure, but it would be much better if the videos did size responsively like the rest of the site.

In the meantime, if you really want to have responsive videos in your site, you could always revert to a single column layout (narrow or wide) for your video page (rather than remove the 'fitvids.js' code).

  • Registered: 2013-02-28
  • Posts: 116

Re: Basic page config issue

In the meantime, if you really want to have responsive videos in your site, you could always revert to a single column layout (narrow or wide) for your video page (rather than remove the 'fitvids.js' code).

I tried this last route you recommended and think it's the best solution until a permanent fix is made. Thanks for your help!

  • Registered: 2012-12-16
  • Posts: 950

Re: Basic page config issue

You're welcome!

  • Registered: 2012-12-16
  • Posts: 950

Re: Basic page config issue

I'm not sure a permanent fix is going to be possible. It looks like the 'fitvids' JavaScript library might not have been designed with multi-column displays in mind.

However, here's another suggestion which you might like to try.

(1) Set the 'Body text layout' to '1-column wide'.

(2) Add your video iframe embedding code to the editor, such as:

<p class="vid"><iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/CH880_VrxxU" width="560"></iframe></p>
<p class="vid"><iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/CH880_VrxxU" width="560"></iframe></p>
<p class="vid"><iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/CH880_VrxxU" width="560"></iframe></p>

(3) Add the following to your 'showkase/_themes/kosel/css/custom.css' file:

@media only screen and (min-width: 768px) {
  .body-content .vid {
    width: 49%;
  }
  .vid:nth-child(odd) {
    float: left;
  }
  .vid:nth-child(even) {
    float: right;
  }
}

The suggestion above, using a single-column layout for your video page or disabling 'fitvids.js' are possibly your best options. (I would probably edge towards a single-column layout for your video page as this will retain the responsive video functionality that 'fitvids' provides.)