Shape 5

Hello,

how can I change the background image, in Risen Hope template, of the module that in demo is "We are passionate about community" ? (Static during scrolling).
In which folder are there the icons of this module?

Thank you,

Enzo

Hello,

1) You can change the background under the Backgrounds Tab in the Template Manager for the appropriate row.

2) These icons are called via a custom html module in the top_row3_1 position.

Hello,

thank you for your answer. My website is www.gesucristo.info
I've solved the first step (the background). About the icons, I can understand that are included with the template, so they aren't image files.
Is it possible to use classic image files like .jpg, .png, .gif ? And the article links?

The code of the module is:

<div class="icon_area_wrap">
<div class="icon_area_wrap_left" data-scroll-reveal="enter from the left over 1s">
<h2><span style="color: #0000ff;">We Are Passionate About <strong>Community</strong></span></h2>
<span style="color: #0000ff;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam molestie mi a nunc porta facilisis. Mauris varius volutpat interdum. In quis congue velit. </span>

<span style="color: #0000ff;"> Egestas eu, lacinia id sem. Curabitur condimentum nunc vitae quam tincidunt vehicula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam molestie mi. </span>

<span style="color: #0000ff;"> <a href="index.php/features-mainmenu-47/template-specific-features" class="readon" style="color: #0000ff;">Learn More About Us[/url]</span>
<div style="clear: both; height: 0px;">&nbsp;</div>
</div>
<div class="icon_area_wrap_right">
<div class="icon_set" style="margin-bottom: 50px;" data-scroll-reveal="enter from the top after 0s">
<div class="icon_outer_wrap">
<div class="icon_hover"><span style="color: #0000ff;"><a href="index.php/pages/sermons" class="ion-link icon_element" style="color: #0000ff;">[/url]</span></div>
<div class="icon_non_hover"><span class="ion-headphone icon_element" style="color: #0000ff;"></span></div>
</div>

<span class="icon_bottom_text" style="color: #0000ff;"> Download Sermons</span></div>
<div class="icon_set" style="margin-bottom: 50px;" data-scroll-reveal="enter from the top after 0.25s">
<div class="icon_outer_wrap">
<div class="icon_hover"><span style="color: #0000ff;"><a href="index.php/pages/news" class="ion-link icon_element" style="color: #0000ff;">[/url]</span></div>
<div class="icon_non_hover"><span class="ion-ios-paper icon_element" style="color: #0000ff;"></span></div>
</div>

<span class="icon_bottom_text" style="color: #0000ff;"> Read Our Blog</span></div>
<div class="icon_set" data-scroll-reveal="enter from the top after 0.5s">
<div class="icon_outer_wrap">
<div class="icon_hover"><span style="color: #0000ff;"><a href="index.php/features-mainmenu-47/template-specific-features" class="ion-link icon_element" style="color: #0000ff;">[/url]</span></div>
<div class="icon_non_hover"><span class="ion-ios-people icon_element" style="color: #0000ff;"></span></div>
</div>

<span class="icon_bottom_text" style="color: #0000ff;"> Our Church Staff</span></div>
<div class="icon_set" data-scroll-reveal="enter from the top after 0.75s">
<div class="icon_outer_wrap">
<div class="icon_hover"><span style="color: #0000ff;"><a href="index.php/events" class="ion-link icon_element" style="color: #0000ff;">[/url]</span></div>
<div class="icon_non_hover"><span class="ion-ios-calendar-outline icon_element" style="color: #0000ff;"></span></div>
</div>

<span class="icon_bottom_text" style="color: #0000ff;"> Calendar of Events</span></div>
<div style="clear: both; height: 0px;">&nbsp;</div>
</div>
<div style="clear: both; height: 0px;">&nbsp;</div>
</div>

Thank you and best regards,

Enzo

Hello,

You would really want to use the ion-icons for simplicity. If you wish to use images you would have to manually code these in and remove the ion-icon calls. Here is an example of a simple image call.

Thank you for your answer and the code.
You are right, icons are good.
I have found a list of icon names in this page: http://www.shape5.com/demo/images/general/ionicons/cheatsheet.html
Is it enough?
How can I define the icon size?

Enzo

Hello,

In the custom.css file you can stylize the icons with the class names.

.ion-alert {
background-color: #ff000;
height: 20px;
width: 20px;}

Thank you very much.

Enzo

NP :)