Shape 5

Joomla Templates => Eventfull - Club => : commie September 01, 2015, 10:54:02 AM



: Modules in top row 1
: commie September 01, 2015, 10:54:02 AM
Hi, I'm editing test.phuketmountainbike.com

 I was working in editor on the code in module responsible for "what" section of athletic template version (sorry, I don't remember the original module name since I renamed it), the one responsible for 2 gallery boxes, video box and a row of infografics below. My video box in the middle doest't work. Can you please tell me what I did wrong?

2.  How can I move titles in the middle of gallery link boxes to the top?

3. How can I center all buttons in top row 3?



: Re: Modules in top row 1
: mikenicoll September 01, 2015, 10:50:12 PM
Hello,

1) You most likely were using an editor that stripped some of the coding (such as TinyMCE). Switch to Editor - None in the Global Configuration and replace it with this coding. Then modify it without the editor on and it will fix the layout.
:
Eventfull is the perfect theme if you are looking to organize and event, conference or just bring people together. Choose from an athletic style or tech/conference.  Dark and Light color modes are also available to choose from.  This text area is a great place to describe what your business event is all about.
<br/><br/><br/>

<div class="services_wrap">
<div class="services_wrap_inner">
<div class="s5_is_css_9">
<img alt="image1" src="images/image1.jpg"></img>
<div class="s5_is_slide_css">
        <div class="s5_is_slide_css_inner">
<h3>2015 Course</h3>
<span class="s5_is_slide_text">
<a class="btn" href="#">View Gallery</a>
</span>
        </div>
</div>
</div>
</div>
</div>

<div class="services_wrap">
<div class="services_wrap_inner">
<div class="s5_is_css_9">
<img alt="image2" src="images/image1.jpg"></img>
<div class="s5_is_slide_css dark s5_higlightback">
        <div class="s5_is_slide_css_inner">
<h3>Watch 2014 Recap</h3>
<span class="s5_is_slide_text">
<a  rel="width:800,height:447" href="http://www.youtube.com/v/4kmZ9uQcA_c" id="youtube" title="Firebug Tutorial Video" class="s5mb"><span class="ion-ios-play" style="color:#000000;font-size: 1.7em;"></span></a>
</span>
        </div>
</div>
</div>
</div>
</div>

<div class="services_wrap">
<div class="services_wrap_inner">
<div class="s5_is_css_9">
<img alt="image3" src="images/image3.jpg"></img>
<div class="s5_is_slide_css">
        <div class="s5_is_slide_css_inner">
<h3>2014 Photos</h3>
<span class="s5_is_slide_text">
<a class="btn" href="#">View Gallery</a>
</span>
        </div>
</div>
</div>
</div>
</div>

<div style="clear:both;height:50px;"></div>


<span class="hide_950">

<div class="pages_portfolio five">
<span class="ion-android-time iconsized"></span><br/>
<span class="icon_light">Hours</span>
<br/>
<span class="icon_bold">3-4 HRS</span>
</div>

<div class="pages_portfolio five">
<span class="ion-map iconsized"></span><br/>
<span class="icon_light">Length</span>
<br/>
<span class="icon_bold">35 Miles</span>
</div>

<div class="pages_portfolio five">
<span class="ion-waterdrop iconsized"></span><br/>
<span class="icon_light">Water</span>
<br/>
<span class="icon_bold">8 Stations</span>
</div>

<div class="pages_portfolio five">
<span class="ion-ribbon-a iconsized"></span><br/>
<span class="icon_light">Difficulty</span>
<br/>
<span class="icon_bold">Moderate</span>
</div>

<div class="pages_portfolio five noborder" >
<span class="ion-ios-flag iconsized"></span><br/>
<span class="icon_light">Checkpoints</span>
<br/>
<span class="icon_bold">3</span>
</div>

</span>

<div style="clear:both;height:90px;"></div>

2) You can use a different Info Slide layout coding. We are using #9 but you can use any of the other ones. Unfortunately the actual Info Slide headings are designed to appear as on overlay on the image. You would need to add some code wrapped heading above the actual info slide coding for it to appear as you mentioned.

http://www.shape5.com/documentation/Vertex-Framework/Core-Features/Info-Slide
http://www.shape5.com/demo/eventfull/athletic/index.php/features-mainmenu-47/template-features/info-slide-enabled

3) Something like this in the custom.css should work:

:
#s5_tab_show_slides_buttons_id4150814038 {
  margin: 0 auto !Important;
  width: 300px !important;}



: Re: Modules in top row 1
: commie September 02, 2015, 05:19:20 AM
1 & 2 - sorted, thanks for help.

3 - I pasted this code into custom.css and nothing have changed...

Also, couple more things (4): As soon as I navigate away from main page I get an image displayed at the top of every page in a strange way - it's doubled side by side and onlt top part of it is visible. How do I fix it?

5) http://test.phuketmountainbike.com/index.php/other-rides  list of articles in a category is undeadable due to font/background color. Where to change it?


: Re: Modules in top row 1
: mikenicoll September 03, 2015, 12:23:22 AM
Hello,

3) Sorry it should be:

:
.s5_tab_show_slides_buttons {
     margin: 0px auto ! important;
     width: 300px ! important;
}

4) The image at the top you can specify an image path in the Template Manager for. You need to use a larger image as it spans the entire width of the site.

5) You can specify a different color for the links with the coding below:

:
.list-title a {
  color: #ff0000;}
}



: Re: Modules in top row 1
: commie September 03, 2015, 03:22:37 AM
5) You can specify a different color for the links with the coding below:

.list-title a {
  color: #ff0000;}

Mike, one last thing. When I choose intro and full text images for articles (bu selecting an image from gallery) they appear in articles full size and some of them are quite big. Is there a way to automatically resize them?

Everything else works, thanks a lot.


: Re: Modules in top row 1
: mikenicoll September 03, 2015, 09:22:02 PM
Hello,

The Template doesn't handle the output of the images. I would try either using smaller sized images or adding a CSS class specific call targeting the intro images and specifying a specific width on them such as 30%.

Regards,


: Re: Modules in top row 1
: commie September 04, 2015, 06:29:13 AM
Can you help me create such a class to put into custom.css? I'n no good at it at all... Using smaller images is an easiest option but the idea was using original images from gallery.


: Re: Modules in top row 1
: mikenicoll September 04, 2015, 03:58:01 PM
Hello,

Can you post a direct URL to a page on your site using an intro image? I will show you the code you could add to target all the images here. However, if you need different sized intro images the best way would be to resize them and upload them to the site specifically for this.

Regards,


: Re: Modules in top row 1
: commie September 05, 2015, 08:51:06 AM
Hello,

Can you post a direct URL to a page on your site using an intro image? I will show you the code you could add to target all the images here. However, if you need different sized intro images the best way would be to resize them and upload them to the site specifically for this.

Regards,

Mike,

It's any of the articles here - http://phuketmountainbike.com/index.php/other-rides


: Re: Modules in top row 1
: mikenicoll September 08, 2015, 09:54:36 PM
Hello,

You could try something like this to create a default width value.

:
.pull-left {
  width: 50% !important;}

Regards,