How to make images smaller

  • Unknown's avatar

    Hi

    Im kinda new to html
    can someone tell me how to make images smaller with some code.
    Here’s the site http://www.theheropipe.com
    the top slider images are to be big but below them they should be smaller..
    Below is the code the images that should be smaller start at line 269 and 289

    thank you for any help.

    <!DOCTYPE html>
    <!–[if lt IE 7 ]><html class=”ie ie6″ <?php language_attributes();?>> <![endif]–>
    <!–[if IE 7 ]><html class=”ie ie7″ <?php language_attributes();?>> <![endif]–>
    <!–[if IE 8 ]><html class=”ie ie8″ <?php language_attributes();?>> <![endif]–>
    <!–[if IE 9 ]><html class=”ie ie9″ <?php language_attributes();?>> <![endif]–>
    <!–[if (gt IE 9)|!(IE)]><!–><html <?php language_attributes();?>> <!–<![endif]–>
    <head>
    <title><?php if ( is_category() ) {
    echo __(‘Category Archive for "’, ‘football’); single_cat_title(); echo __(‘" | ‘, ‘football’); bloginfo( ‘name’ );
    } elseif ( is_tag() ) {
    echo __(‘Tag Archive for "’, ‘football’); single_tag_title(); echo __(‘" | ‘, ‘football’); bloginfo( ‘name’ );
    } elseif ( is_archive() ) {
    wp_title(”); echo __(‘ Archive | ‘, ‘football’); bloginfo( ‘name’ );
    } elseif ( is_search() ) {
    echo __(‘Search for "’, ‘football’).wp_specialchars($s).__(‘" | ‘, ‘football’); bloginfo( ‘name’ );
    } elseif ( is_home() || is_front_page()) {
    bloginfo( ‘name’ );
    } elseif ( is_404() ) {
    echo __(‘Error 404 Not Found | ‘, ‘football’); bloginfo( ‘name’ );
    } elseif ( is_single() ) {
    wp_title(”);
    } else {
    echo wp_title( ‘ | ‘, false, right ); bloginfo( ‘name’ );
    } ?></title>

    <meta name=”format-detection” content=”telephone=no”>

    <meta name=”description” content=”<?php wp_title(); echo ‘ | ‘; bloginfo( ‘description’ ); ?>” />
    <meta charset=”<?php bloginfo( ‘charset’ ); ?>” />
    <meta name=”viewport” content=”width=device-width,initial-scale=1.0″>
    <link rel=”profile” href=”http://gmpg.org/xfn/11″ />
    <?php if(of_get_option(‘favicon’) != ”){ ?>
    <link rel=”icon” href=”<?php echo of_get_option(‘favicon’, “” ); ?>” type=”image/x-icon” />
    <?php } else { ?>
    <link rel=”icon” href=”<?php bloginfo( ‘template_url’ ); ?>/favicon.ico” type=”image/x-icon” />
    <?php } ?>
    <link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>” />
    <link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo( ‘name’ ); ?>” href=”<?php bloginfo( ‘rss2_url’ ); ?>” />
    <link rel=”alternate” type=”application/atom+xml” title=”<?php bloginfo( ‘name’ ); ?>” href=”<?php bloginfo( ‘atom_url’ ); ?>” />
    <?php /* The HTML5 Shim is required for older browsers, mainly older versions IE */ ?>

    <!–[if lt IE 8]>

    <![endif]–>

    <!–[if gte IE 9]>
    <style type=”text/css”>
    .gradient {
    filter: none;
    }
    </style>
    <![endif]–>

    <!–[if (gte IE 6)&(lte IE 8)]>
    ?php%20bloginfo(%20'template_url'%20);%20?/js/selectivizr-min.js

    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/normalize.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/default.css” />
    <link rel=”stylesheet” title=”styles1″ type=”text/css” media=”all” href=”” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/prettyPhoto.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/owl.carousel.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/owl.transitions.css” />

    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/480.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/320.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/768.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/1300.css” />

    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/bootstrap.css” />
    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/bootstrap-responsive.css” />

    <?php
    /* We add some JavaScript to pages with the comment form
    * to support sites with threaded comments (when in use).
    */
    if ( is_singular() && get_option( ‘thread_comments’ ) )
    wp_enqueue_script( ‘comment-reply’ );

    /* Always have wp_head() just before the closing
    * tag of your theme, or you will break many plugins, which
    * generally use this hook to add elements to such
    * as styles, scripts, and meta tags.
    */
    wp_head();
    ?>

    // initialise plugins
    jQuery(function(){
    // main navigation init
    jQuery(‘ul.sf-menu’).superfish({
    delay: , // one second delay on mouseout
    animation: {opacity:”,height:”}, // fade-in and slide-down animation
    speed: ”, // faster animation speed
    autoArrows: , // generation of arrow mark-up (for submenu)
    dropShadows: false
    });

    });

    // Init for audiojs
    audiojs.events.ready(function() {
    var as = audiojs.createAll();
    });

    // Init for si.files
    SI.Files.stylizeAll();

    <link rel=”stylesheet” type=”text/css” media=”all” href=”/css/ie.css” />

    ID, ‘custombodyclass_value’, true);
    $cclass = ”;
    if ($custbodyClass) { $cclass = $custbodyClass; } ?>

    <body >

    /” title=””>|

    /” title=””>|

    /” id=”logo”>
    ” alt=”” title=””>

    /” id=”logo”>
    /images/logo.png” alt=”” title=””>

    Menu

    <?php wp_nav_menu( array(
    ‘container’ => ‘ul’,
    ‘menu_class’ => ‘sf-menu’,
    ‘menu_id’ => ‘topnav’,
    ‘depth’ => 0,
    ‘theme_location’ => ‘header_menu’,
    ));
    ?>
    </div>
    </nav><!–.primary–>
    </section>
    </div>
    </div>
    </div>
    </header>

    <?php if( !is_front_page() ) { ?>

    <?php
    $post_meta_data = get_post_custom($post->ID);

    $full_image_url = wp_get_attachment_url($post_meta_data[‘football_topheader’][0], ‘full’);
    $image = aq_resize( $full_image_url, 1599, 341, true ); //resize & crop img

    if (!$image) {
    $image = get_bloginfo(‘template_url’).’/images/banner_photo1.jpg’;
    }
    ?>
    <section id=”photoBanner” style=”background: url(<?php echo $image; ?>) center 0 no-repeat; “>

    </div>

    </div>
    </div> </div>
    </div>

    </div>
    </div>

    </section>
    <? } ?>

    <?php if( is_front_page() ) { ?>


    1

    2


    3

    </div>
    <center>
    <p>

    <p/><center/>
    </div>
    </div>

    <section id=”carouselArea”>

    </div>
    </div>
    </section>

    <section id=”bannerArea”>

    </div>
    </div>
    </section>

    <?php } ?>

    <section id=”primaryWrapContent” class=”clearfix”>

    The blog I need help with is: (visible only to logged in users)

  • The topic ‘How to make images smaller’ is closed to new replies.