Solved

how to move images on website

Posted on 2013-11-06
12
366 Views
Last Modified: 2013-11-06
Hi Guys,

I was wondering how can i move images so the attached ones here are right of the logo? in the site  http://dancingsoul.greatlocks.ie/
logo3.png
logo4.png
0
Comment
Question by:jonathanduane2010
  • 6
  • 6
12 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39628317
Just add them after your logo div e.g.

<div id="logo">
<a href="http://dancingsoul.greatlocks.ie"><img alt="The Dancing Soul" src="http://dancingsoul.greatlocks.ie/wp-content/uploads/2013/11/top-logo.png"></a>
</div>

<img src="http://filedb.experts-exchange.com/incoming/2013/11_w45/686706/logo3.png">
<img src="http://filedb.experts-exchange.com/incoming/2013/11_w45/686707/logo4.png">

And add any margin you want to space them out.
0
 

Author Comment

by:jonathanduane2010
ID: 39628329
This is a wordpress site, so do i add in the index.php or in the css
0
 
LVL 58

Expert Comment

by:Gary
ID: 39628351
No in the header e.g.
wp-content/themes/classic/header.php
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:jonathanduane2010
ID: 39628393
hi,

i cant find the header.php in the root?

in wordpress this is what it looks like in the editor

<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" <?php language_attributes(); ?>> <!--<![endif]-->
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width">
	
	<?php if(is_front_page() && of_get_option('home_title')): ?>
	<title><?php echo of_get_option('home_title'); ?></title>
	<?php else: ?>
	<title><?php bloginfo('name'); ?> <?php wp_title(' - ', true, 'left'); ?></title>
	<?php endif; ?>
	
	<?php if(is_front_page() && of_get_option('home_meta')): ?>
    <meta name="description" content="<?php echo of_get_option('home_meta'); ?>" /> 
	<?php endif; ?>
	
	<?php if(of_get_option('favicon')): ?>
	<link href="<?php echo of_get_option('favicon'); ?>" rel="shortcut icon" /> 
	<?php endif; ?>


	<?php wp_head(); ?>
	
	<?php if(of_get_option('custom_css')): ?>
	<?php echo '<style type="text/css">'; ?>
	<?php echo of_get_option('custom_css'); ?>
	<?php echo '</style>'; ?>
	<?php endif; ?>
	
	<?php if(of_get_option('custom_js')): ?>
	<?php echo '<script type="text/javascript">'; ?>
	<?php echo of_get_option('custom_js'); ?>
	<?php echo '</script>'; ?>
	<?php endif; ?>
	
	
	<?php echo '<style type="text/css">'; ?>
	/*====================================================
	Menu Background Color - Default: #454a52
	====================================================*/
	header, #header-top .sf-menu li li {background-color:<?php echo of_get_option('menu_bg_color', '#454a52'); ?>; } 
	
	/*====================================================
	Footer Background Color - Default: #454a52
	====================================================*/
	footer {background-color:<?php echo of_get_option('footer_bg_color', '#454a52'); ?>;}
	
	/*====================================================
	Link Color - Default: #7f7f7f
	====================================================*/
	a {color:<?php echo of_get_option('link_color', '#7f7f7f'); ?>} /* Default link  */
	a:hover { color:<?php echo of_get_option('link_color_hover', '#7f7f7f'); ?>} /* Default link:hover*/
	
	/*====================================================
	Heading Colors and Sizes - Default: #7f7f7f and Footer #ffffff
	====================================================*/
	h1, h2, h3, h4, h5, h6 {color:<?php echo of_get_option('heading_color', '#7f7f7f'); ?>;}
	footer h1, footer h2, footer h3, footer h4, footer h5, footer h6 {color:<?php echo of_get_option('footer_heading_color', '#ffffff'); ?>;}
	h1 { font-size: <?php echo of_get_option('h1_size', '28'); ?>px; } 
	h2 { font-size: <?php echo of_get_option('h2_size', '24'); ?>px; } 
	h3 { font-size: <?php echo of_get_option('h3_size', '16'); ?>px; }
	h4 { font-size: <?php echo of_get_option('h4_size', '15'); ?>px; } 
	h5 { font-size: <?php echo of_get_option('h5_size', '13'); ?>px; } 
	h6 { font-size: <?php echo of_get_option('h6_size', '11'); ?>px; }
	
	/*====================================================
	Fonts
	====================================================*/
	body {font-family:<?php echo of_get_option('body_font', '"Helvetica Neue"'); ?>, Helvetica, Arial, Sans-Serif;}
	h1, h2, h3, h4, h5, h6, nav a, ul.tabNavigation, .more-link-slider span, .post-details-slider, .button, .portfolio-details, .blog-details, .blog-pagination, .content-container-base-pagination, .home-page-older {font-family: <?php echo of_get_option('heading_font', '"Lato"'); ?>, Helvetica, Arial, Sans-Serif;  }
	
	/*====================================================
	Navigation Background and colors
	====================================================*/
	#navigation-narrow nav, #navigation-narrow .sf-menu li li,
	#navigation-wide nav, #navigation-wide .sf-menu li li
	{background-color:<?php echo of_get_option('narrow_navigation', '#ffffff'); ?>;}
	
	#navigation-narrow-dark nav, #navigation-narrow-dark .sf-menu li li,
	#navigation-wide-dark nav, #navigation-wide-dark .sf-menu li li
	{background-color:<?php echo of_get_option('dark_navigation', '#7a7a7a'); ?>;}
	
	<?php echo '</style>'; ?>

</head>
<body <?php body_class(); ?>>
	<header>
		
		<div id="header-top-container">
			<div id="header-top">
				
				<div id="header-top-left">
					<?php
						wp_nav_menu(array( 'theme_location' => 'my_top_nav', 'depth' => 2, 'fallback_cb' => false, 'menu_class' => 'sf-menu', 'container' => 'false', 'container_class' => ''  ));
					?>
							
				</div><!-- close #header-top-left -->

				
				<?php if(of_get_option('header_icons', 'yes') == 'yes'): ?>
				<div id="header-top-right">
					
					<div class="social-icons">
						<?php if(of_get_option('twitter_id')): ?>
						<a href="<?php echo of_get_option('twitter_id'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/twitter.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('facebook_link')): ?>
						<a href="<?php echo of_get_option('facebook_link'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/facebook.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('tumblr_link')): ?>
						<a href="<?php echo of_get_option('tumblr_link'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/tumblr.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('dribbble_link')): ?>
						<a href="<?php echo of_get_option('dribbble_link'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/dribbble.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('skype_id')): ?>
						<a href="<?php echo of_get_option('skype_id'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/skype.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('vimeo_channel')): ?>
						<a href="<?php echo of_get_option('vimeo_channel'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/vimeo.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('youtube_channel')): ?>
						<a href="<?php echo of_get_option('youtube_channel'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/youtube.png" alt="" class="transparent" /></a>
						<?php endif; ?>
						<?php if(of_get_option('email_address')): ?>
						<a href="mailto:<?php echo of_get_option('email_address'); ?>" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/social-icons/email.png" alt="" class="transparent" /></a>
						<?php endif; ?>
					</div>
				</div><!-- close #header-top-right -->
				
				<?php endif; ?>
				
				<div class="clearfix"></div>
			</div><!-- close #header-top -->
		</div><!-- close #header-top-container -->
		
		
		
		<div id="header-gradient">
			
			<div id="header-logo-container">
				<div id="logo"><a href="<?php echo site_url(); ?>"><img src="<?php echo of_get_option('logo', get_template_directory_uri() . "/images/logo.png"); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" /></a></div>
				
				
				<?php
					if(of_get_option('display_searchbox', 'yes') == 'yes'):
				?>
				
					<div id="header-logo-right">
						<form method="get" class="searchform" action="<?php echo site_url(); ?>">
							<label for="s" class="assistive-text"><?php _e('Search','progressionstudios'); ?></label>
							<input type="text" class="field" name="s" id="s" placeholder="<?php _e('Search','progressionstudios'); ?>" />
							<input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php _e('Search','progressionstudios'); ?>" />
						</form>
						
						
					</div><!-- close #header-logo-right -->
					
				<?php
					elseif(of_get_option('display_searchbox', 'yes') == 'ad'):
				?>
				
					<div id="header-logo-right">

						<div class="advertisement">
							<?php echo of_get_option('header_ad_code'); ?>
						</div>

					</div><!-- close #header-logo-right -->
					
				<?php
					endif;
				?>
			
			<div class="clearfix"></div>
			</div><!-- close #header-logo-container -->
			
			<div id="navigation-<?php echo of_get_option('navigation_style','narrow'); ?>">
				<nav>
					<?php
						wp_nav_menu(array( 'theme_location' => 'my_main_nav', 'depth' => 4, 'fallback_cb' => false, 'menu_class' => 'sf-menu', 'container' => 'false',  'container_class' => ''  ));
					?>
							
					<div class="clearfix"></div>
				</nav>
			</div><!-- close #navigation-narrow -->

		</div><!-- close #header-gradient -->
		
	</header>
	
	
	<div id="main" role="main">

Open in new window

0
 
LVL 58

Expert Comment

by:Gary
ID: 39628420
You can add them just before

</div><!-- close #header-top-left -->
0
 

Author Comment

by:jonathanduane2010
ID: 39628433
great, thanks ok i have done that

how can i get rid of the white part underneath now? and change the grey to white??
0
 
LVL 58

Expert Comment

by:Gary
ID: 39628455
In your stylesheet

line 215- remove
#header-top-container {
    background: url("images/header-top-background.png") repeat-x scroll left bottom #FFFFFF;
}


From the HTML remove
<div id="header-logo-container">
      <div id="logo"><a href="http://dancingsoul.greatlocks.ie"><img alt="The Dancing Soul" src=""></a></div>
0
 

Author Comment

by:jonathanduane2010
ID: 39628471
thank you!!

thats great!

Can i ask one last question?

Is there a way of bringing the slider up? so the white space is minimal?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39628488
And get rid of the Home bit?

I would just add the bolded line to your settings.css (line 17)

.rev_slider_wrapper {
    margin-top: -70px !important;
   position: relative;
}
0
 

Author Comment

by:jonathanduane2010
ID: 39628516
Hi,

I cant find settings.css ??
0
 
LVL 58

Accepted Solution

by:
Gary earned 445 total points
ID: 39628571
0
 

Author Comment

by:jonathanduane2010
ID: 39628579
great thank you
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Can you send emails to checkbox selection in contact form 7 Wordpress 6 25
CSS issue 8 31
Change div area and length 1 26
Checkout Page Input Field not aligned 1 20
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Developer portfolios can be a bit of an enigma—how do you present yourself to employers without burying them in lines of code?  A modern portfolio is more than just work samples, it’s also a statement of how you work.
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

813 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now