Documentation

iCagenda user guide and tips

3.4.0 : Add Feature Icons

The feature icons can be easily displayed in your custom theme pack.
To display feature icons, please follow instructions below.

 

LIST OF EVENTS

  1. Open YOUR_THEME_events.php in a text editor.

  2. Add those lines where you want to display feature icons:
    						<?php // Feature icons ?>
    						<?php if (!empty($FEATURES_ICONSIZE_LIST)) : ?>
    						<div class="ic-features-container">
    							<?php foreach ($FEATURES_ICONS as $icon) : ?>
    							<div class="ic-feature-icon">
    								<img class="iCtip" src ="<?php echo $FEATURES_ICONROOT_LIST . $icon['icon'] ?>" alt="<?php echo $icon['icon_alt'] ?>" title="<?php echo $SHOW_ICON_TITLE == '1' ? $icon['icon_alt'] : '' ?>" >
    							</div>
    							<?php endforeach ?>
    						</div>
    						<?php endif ?>
    

     

     
  3. Open css/YOUR_THEME_component.css in a text editor.

  4. Add CSS declarations for feature icons:

    /* Feature Icons */
    /* Event List */
    .ic-content > .ic-features-container {
    }
    /* Event Detail */
    .ic-content > .ic-features-container {
    	margin-right: -5px;
    	margin-top: 5px;
    }
    .ic-feature-icon {
    	float: right;
    }
    

 


EVENT DETAILS

  1. Open YOUR_THEME_event.php in a text editor.

  2. Add those lines where you want to display feature icons:
    		<?php // Feature icons ?>
    		<?php if (!empty($FEATURES_ICONSIZE_EVENT)) : ?>
    		<div class="ic-features-container">
    			<?php foreach ($FEATURES_ICONS as $icon) : ?>
    			<div class="ic-feature-icon">
    				<img class="iCtip" src ="<?php echo $FEATURES_ICONROOT_EVENT . $icon['icon'] ?>" alt="<?php echo $icon['icon_alt'] ?>" title="<?php echo $SHOW_ICON_TITLE == '1' ? $icon['icon_alt'] : '' ?>">
    			</div>
    			<?php endforeach ?>
    		</div>
    		<?php endif ?>
    
     
  3. CSS classes and HTML structure may be different depending of your custom coding. The code above is extracted from the official theme pack 'default', and calling 'default' CSS classes.

 


MODULE CALENDAR TOOLTIP

  1. Open YOUR_THEME_day.php in a text editor.

  2. Add those lines where you want to display feature icons, inside foreach($events as $e){ ... } :
    				// Display feature icons, if required
    				if (!empty($e['features_icon_size'])) : ?>
    				<div class="ic-features-container">
    					<?php foreach ($e['features'] as $icon) : ?>
    					<div class="ic-feature-icon">
    						<img src ="<?php echo $e['features_icon_root'] . $icon['icon'] ?>" alt="<?php echo $icon['icon_alt'] ?>" title="<?php echo $e['show_icon_title'] == '1' ? $icon['icon_alt'] : '' ?>">
    					</div>
    					<?php endforeach ?>
    				</div>
    				<?php endif;
    
     
  3. Open css/YOUR_THEME_module.css in a text editor.

  4. Add CSS styling in :
    /* Features */
    #ictip .ic-features-container {
    	margin: 2px;
    }
    #ictip .ic-feature-icon {
    	float: right;
    	margin: 0px 0.5px;
    }
    
     

Follow Us

Search