How to create banner in header - php

my site is on WP and I using Hueman theme.
I want to add baner in right side of header. Now Im using header image, which have max. width and I dont know if I should add my banner on this header image or cut width header image and add banner next to it.
I searched a lot and I found a solution:
https://wordpress.org/support/topic/ads-11?replies=6#post-4906945
I have no idea where I can put divs with my banner, this is how looks header.php
<!DOCTYPE html>
<html class="no-js" <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php wp_title(''); ?></title>
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header id="header">
<?php if ( has_nav_menu('topbar') ): ?>
<nav class="nav-container group" id="nav-topbar">
<div class="nav-toggle"><i class="fa fa-bars"></i></div>
<div class="nav-text"><!-- put your mobile menu text here --></div>
<div class="nav-wrap container"><?php wp_nav_menu(array('theme_location'=>'topbar','menu_class'=>'nav container-inner group','container'=>'','menu_id' => '','fallback_cb'=> false)); ?></div>
<div class="container">
<div class="container-inner">
<div class="toggle-search"><i class="fa fa-search"></i></div>
<div class="search-expand">
<div class="search-expand-inner">
<?php get_search_form(); ?>
</div>
</div>
</div><!--/.container-inner-->
</div><!--/.container-->
</nav><!--/#nav-topbar-->
<?php endif; ?>
<div class="container group">
<div class="container-inner">
<?php if (ot_get_option('header-image') == ''): ?>
<div class="group pad">
<?php echo alx_site_title(); ?>
<?php if (ot_get_option('site-description') != 'off'): ?><p class="site-description"><?php bloginfo('description'); ?></p><?php endif; ?>
</div>
<?php endif; ?>
<?php if (ot_get_option('header-image')): ?>
<a href="<?php echo home_url('/'); ?>" rel="home">
<img class="site-image" src="<?php echo ot_get_option('header-image'); ?>" alt="<?php get_bloginfo('name'); ?>">
</a>
<?php endif; ?>
<?php if (has_nav_menu('header')): ?>
<nav class="nav-container group" id="nav-header">
<div class="nav-toggle"><i class="fa fa-bars"></i></div>
<div class="nav-text"><!-- put your mobile menu text here --></div>
<div class="nav-wrap container"><?php wp_nav_menu(array('theme_location'=>'header','menu_class'=>'nav container-inner group','container'=>'','menu_id' => '','fallback_cb'=> false)); ?></div>
</nav><!--/#nav-header-->
<?php endif; ?>
</div><!--/.container-inner-->
</div><!--/.container-->
</header><!--/#header-->
<div class="container" id="page">
<div class="container-inner">
<div class="main">
<div class="main-inner group">
And this is my custom.css edited by me to hide this banner from mobile users
/*
Add your custom styles in this file instead of style.css so it
is easier to update the theme. Simply copy an existing style
from style.css to this file, and modify it to your liking.
When you update your theme, backup this file and re-add it after.
*/
/* Global */
.mystyle {}
.ads-header-desktop {
display: block;
float: right;
margin-right: 5px;
margin-top: -95px;
}
/* hide or display */
.ads-header-desktop { display: block; }
#media only screen and (max-width: 800px) {
.ads-header-desktop { display: none; }
}
/* Tablet - 800px, 768px & 720px */
#media only screen and (min-width: 720px) and (max-width: 800px) {
.mystyle {}
}
/* Mobile - 480px & 320px */
#media only screen and (max-width: 719px) {
.mystyle {}
}
/* Mobile - 320px */
#media only screen and (max-width: 479px) {
.mystyle {}
}
Summa summarum:
This is my site: www.st-mobilny.pl and I want to do something like that: 1drv.ms/1RoUkIV

Your best bet is to add it with position absolute:
<div class="container-inner">
<div class="banner"><img src="path/to/image" alt=""></div>
<?php if (ot_get_option('header-image') == ''): ?>
In your CSS:
.container-inner {
position: relative;
}
.banner {
position: absolute;
top: 50px;
right: 0px;
z-index: 100;
}
#media screen and (max-width: 768px) { .banner { position: static;} }
Change the top and right to whatever you want. I added a sample media query to show how you could change it, so once you go into mobile, the banner goes above the logo. If you want the banner below the logo, move the div in the html to above the menu.

Related

Sticky Footer in HTML, does not appear at the bottom of the page

I want to place my footer at the bottom of the screen, have used a div with the "wrap" id on the body of my index, but the footer does not seem to stick below it.
Please help me with this issue.
I have included my index.php, footer.php and css.php files
index.php
<?php include('config/setup.php');?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo $page['title'].' | '.$site_title; ?></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php include('config/css.php'); ?>
<?php include('config/js.php'); ?>
</head>
<body>
<div id="wrap">
<?php include(D_TEMPLATE.'/navigation.php'); ?>
<div class="container">
<h1><?php echo $page['header'];?></h1>
<?php echo $page['body_formatted']; ?>
</div>
</div><!-- END wrap -->
<?php include(D_TEMPLATE.'/footer.php'); ?>
<div id="console-debug">
<pre>
<?php print_r($page); ?>
</pre>
</div>
</body>
</html>
footer.php
<footer id="footer">
<div class="container">
<p>This is my footer</p>
</div>
</footer><!-- END footer -->
css.php
<?php
//CSS:
?>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- jQuery CSS -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<style>
html,
body {
height=100%;
/* The html and body elements cannot have any padding or margin */
}
/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
height: auto;
/* Negative indent footer by its height */
margin: 0 auto -60px;
/* Pad bottom by footer height */
padding: 0 0 60px;
}
/* Set the fixed height of the footer here */
#footer {
width:100%;
height: 60px;
background-color: #f5f5f5;
}
#btn-debug {
position: absolute;
}
#console-debug{
position:absolute
}
</style>
For sticky footer you can just add this code
#footer{
position:fixed;
left:0px;
right:0px;
bottom:0px;
width:100%;
z-index:99;
min-height: ;/*According to requirement*/
background-color: ;/*set color whichever you want*/
}
You should try to set your position:fixed
So it won't move

Wordpress Body Above Header when it should be Inline

Here is a codepen to see the code I have written and works.
When I write similar code in my wordpress theme, my body appears above the header. How can I get the body next to the header?
[BONUS] What is the best way/how to align the body centered between the right-edge of the header and the right side of the screen.
Any advice is highly appreciated, and I thank you in advance.
[EDIT]: I changed my code for my wordpress site because before I was targeting body with css like I did in my codepen, but instead I created a div with class .site and am using that as the body. This is a temporary fix, but it is working as intended. How could I better achieve this affect so I can integrate visual plugin builders such as beaver builder?
HTML:
<div id="header">
<img src="http://placehold.it/100x100">
<ul id="nav">
<li>Item 1</li>
<li>Item 2</li>
<li>Item Number 3</li>
<li>Item #4</li>
</ul>
</div>
<div id="body">
<div id="container">Body
</div>
</div>
</div>
CSS:
#header,
#body {
display: inline-block;
}
#header {
white-space: nowrap;
width: 15%;
height: 100%;
float: left;
text-align: right;
position: fixed;
//border: 1px solid green;
}
#header img {
}
#nav ul {
list-style: none;
}
#nav {
position: absolute;
bottom: 4%;
right: 0;
}
#body {
width: 80%;
float: right;
//border: 1px solid yellow;
}
#container {
height: 10000px;
}
HEADER.PHP:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url')?>" />
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width">
<title><?php bloginfo('name'); ?></title>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<!-- Site Header -->
<header class="site-header">
<?php the_custom_logo(); ?>
<?php wp_nav_menu(array('theme_location','Primary','menu_class'=>'main-navigation')); ?>
</header>
<!-- /Site Header -->
<!-- Site Content -->
Part of the problem was that I had a php error in my functions.php. Also I changed the position of the site content to absolute and the site nav to fixed. I then set the width of the sidebar nav and site content. I also added a content loop to my header to create the content area. Both site nav and content are displayed inline-block.
Everything now seems to be working.

Wordpress TwentyTwelve Navbar and Logo BUG

I have a problem with my Navbar and logo.
I have modified the Navbar that it is in a fix position on top with 100% width.
I put the logo function also out of the page div so it is above the page in the header area.
The problem is that when I set the nav-bar margin-top to 0 the logo is under the navbar.
When I set the logos margin-top to about 5rem it puts down the nav-bar to the place where the Logo starts.
Here are my codes for better understanding:
Header.php
<?php
/**
* The Header template for our theme
*
* Displays all of the <head> section and everything up till <div id="main">
*
* #package WordPress
* #subpackage Twenty_Twelve
* #since Twenty Twelve 1.0
*/
?><!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) | !(IE 8) ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width" />
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php // Loads HTML5 JavaScript file to add support for HTML5 elements in older IE versions. ?>
<!--[if lt IE 9]>
<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="navbar" class="navbar">
<nav id="site-navigation" class="main-navigation" role="navigation">
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
</nav><!-- #site-navigation -->
</div>
<div id="mainlogo" class="mainlogo">
<?php if ( get_header_image() ) : ?>
<img src="<?php header_image(); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" />
<?php endif; ?>
</div id="mainlogo" class="mainlogo">
<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
<div id="slider" class="slider">
<?php layerslider(1) ?>
</div>
</header><!-- #masthead -->
<div id="main" class="wrapper">
Style.css
.header-image {
display: block;
margin-top: 0rem;
margin-left: auto;
margin-right: auto;
}
/* Navigation Menu */
.main-navigation {
margin-top: 0p;
margin-top: 0rem;
position: fixed;
z-index: 999;
opacity:1;
filter:alpha(opacity=100);
width: 100%;
margin-top: 0px;
margin-top: 0rem;
text-align: center;
}
.main-navigation li {
margin-top: 24px;
margin-top: 1.714285714rem;
font-size: 28px;
font-size: 1rem;
line-height: 1.42857143;
}
.main-navigation a {
color: #5e5e5e;
}
.main-navigation a:hover,
.main-navigation a:focus {
color: #FFF;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: none;
margin-left: 3rem;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
display: inline-block;
}
/* Menu Background */
.nav-menu {
background-image: url("img/menu_repeat.png");
padding-left: 0rem;
padding-right: 0rem;
}
.slider {
margin-top: 15px;
margin-top: 1rem;
}
.mainlogo {
margin-top: 50px;
margin-top: 5rem;
}
.navbar {
margin-top: 0px;
margin-top: 0rem;
}
Use absolute positioning. Parent of nav should be relative positioned, and then the absolute positioned nav will be positioned in relation to that parent.
EDIT:
http://jsfiddle.net/y54m874c/
See this fiddle. In there I relatively positioned header class in which I put logo and navigation. Navigation is absolutely positioned in relation to that container. If I put nav > ul relatively positioned, and then put absolute position on li elements, then I could move them around in that unsorted list that contains them. If I removed the relative positioning in the unsorted list, then the list items would look for the next container they're in and watch what is relatively positioned, and use that as a reference.
Relative position by itself doesn't have to mean a thing. You can just say an element has a relative position, and then the inside elements will position according to him, and that element can stay where it is. But, you could also use relative positioning to position an element relative to itself.
Fixed position looks the height and the width of the window browser, and that is the 'reference frame' for it. It will move in relation to it. Static position is the default and it follows the flow of the html elements.
You could also use floats, but then you couldn't position elements to your liking.
The middle ground is to find when it's good for you to use manual positioning, and when to use floats.
Ok i got it.
I set #navbar to fixed and main-menu to fixed too.
seems to work as expectet
Thanks to all.

Hacked Joomla 3.1 administrator login page

My website was hacked, and i can see login page on my joomla administrator login page
here is the url of login page:
http://societ.us/administrator/index.php
the hacker was add code (at line 13-15):
<style type="text/css">
html { display:none }
</style>
Do you know how to remove that code?
I have checked few file below (and many more), and i haven't found it
in /home/societ/societ.us/administrator/templates/isis/login.php
<?php
/**
* #package Joomla.Administrator
* #subpackage Templates.isis
*
* #copyright Copyright (C) 2005 - 2013 Open Source Matters, Inc. All rights reserved.
* #license GNU General Public License version 2 or later; see LICENSE.txt
*/
defined('_JEXEC') or die;
$app = JFactory::getApplication();
$doc = JFactory::getDocument();
$lang = JFactory::getLanguage();
// Add JavaScript Frameworks
JHtml::_('bootstrap.framework');
JHtml::_('bootstrap.tooltip');
// Add Stylesheets
$doc->addStyleSheet('templates/' .$this->template. '/css/template.css');
// Load optional RTL Bootstrap CSS
JHtml::_('bootstrap.loadCss', false, $this->direction);
// Load specific language related CSS
$file = 'language/' . $lang->getTag() . '/' . $lang->getTag() . '.css';
if (is_file($file))
{
$doc->addStyleSheet($file);
}
// Detecting Active Variables
$option = $app->input->getCmd('option', '');
$view = $app->input->getCmd('view', '');
$layout = $app->input->getCmd('layout', '');
$task = $app->input->getCmd('task', '');
$itemid = $app->input->getCmd('Itemid', '');
$sitename = $app->getCfg('sitename');
// Check if debug is on
$config = JFactory::getConfig();
$debug = (boolean) $config->get('debug');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<jdoc:include type="head" />
<script type="text/javascript">
window.addEvent('domready', function ()
{
document.getElementById('form-login').username.select();
document.getElementById('form-login').username.focus();
});
</script>
<style type="text/css">
/* Responsive Styles */
#media (max-width: 480px) {
.view-login .container {
margin-top: -170px;
}
.btn {
font-size: 13px;
padding: 4px 10px 4px;
}
}
<?php if ($debug) : ?>
.view-login .container {
position: static;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
}
.view-login .navbar-fixed-bottom {
display: none;
}
<?php endif; ?>
</style>
<!--[if lt IE 9]>
<script src="../media/jui/js/html5.js"></script>
<![endif]-->
</head>
<body class="site <?php echo $option . " view-" . $view . " layout-" . $layout . " task-" . $task . " itemid-" . $itemid . " ";?>">
<!-- Container -->
<div class="container">
<div id="content">
<!-- Begin Content -->
<div id="element-box" class="login well">
<img src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template ?>/images/joomla.png" alt="Joomla!" />
<hr />
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>
<noscript>
<?php echo JText::_('JGLOBAL_WARNJAVASCRIPT') ?>
</noscript>
<!-- End Content -->
</div>
</div>
<div class="navbar navbar-fixed-bottom hidden-phone">
<p class="pull-right">© <?php echo $sitename; ?> <?php echo date('Y');?></p>
<a class="login-joomla" href="http://www.joomla.org" class="hasTooltip" title="<?php echo JHtml::tooltipText('TPL_ISIS_ISFREESOFTWARE');?>">Joomla!®</a>
<i class="icon-share icon-white"></i> <?php echo JText::_('COM_LOGIN_RETURN_TO_SITE_HOME_PAGE') ?>
</div>
<jdoc:include type="modules" name="debug" style="none" />
</body>
</html>
in /home/societ/societ.us/administrator/templates/isis/index.php
<?php
/**
* #package Joomla.Administrator
* #subpackage Templates.isis
* #copyright Copyright (C) 2005 - 2013 Open Source Matters, Inc. All rights reserved.
* #license GNU General Public License version 2 or later; see LICENSE.txt
* #since 3.0
*/
defined('_JEXEC') or die;
$app = JFactory::getApplication();
$doc = JFactory::getDocument();
$lang = JFactory::getLanguage();
$this->language = $doc->language;
$this->direction = $doc->direction;
$input = $app->input;
$user = JFactory::getUser();
// Add JavaScript Frameworks
JHtml::_('bootstrap.framework');
$doc->addScript('templates/' .$this->template. '/js/template.js');
// Add Stylesheets
$doc->addStyleSheet('templates/' . $this->template . '/css/template.css');
// Load optional RTL Bootstrap CSS
JHtml::_('bootstrap.loadCss', false, $this->direction);
// Load specific language related CSS
$file = 'language/' . $lang->getTag() . '/' . $lang->getTag() . '.css';
if (is_file($file))
{
$doc->addStyleSheet($file);
}
// Detecting Active Variables
$option = $input->get('option', '');
$view = $input->get('view', '');
$layout = $input->get('layout', '');
$task = $input->get('task', '');
$itemid = $input->get('Itemid', '');
$sitename = $app->getCfg('sitename');
$cpanel = ($option === 'com_cpanel');
$showSubmenu = false;
$this->submenumodules = JModuleHelper::getModules('submenu');
foreach ($this->submenumodules as $submenumodule)
{
$output = JModuleHelper::renderModule($submenumodule);
if (strlen($output))
{
$showSubmenu = true;
break;
}
}
// Logo file
if ($this->params->get('logoFile'))
{
$logo = JUri::root() . $this->params->get('logoFile');
}
else
{
$logo = $this->baseurl . "/templates/" . $this->template . "/images/logo.png";
}
// Template Parameters
$displayHeader = $this->params->get('displayHeader', '1');
$statusFixed = $this->params->get('statusFixed', '1');
$stickyToolbar = $this->params->get('stickyToolbar', '1');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<jdoc:include type="head" />
<?php
// Template color
if ($this->params->get('templateColor'))
{
?>
<style type="text/css">
.navbar-inner, .navbar-inverse .navbar-inner, .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover, .navbar-inverse .nav li.dropdown.open > .dropdown-toggle, .navbar-inverse .nav li.dropdown.active > .dropdown-toggle, .navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle, #status.status-top
{
background: <?php echo $this->params->get('templateColor');?>;
}
.navbar-inner, .navbar-inverse .nav li.dropdown.open > .dropdown-toggle, .navbar-inverse .nav li.dropdown.active > .dropdown-toggle, .navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle{
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1), inset 0 30px 10px rgba(0, 0, 0, .2);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1), inset 0 30px 10px rgba(0, 0, 0, .2);
box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1), inset 0 30px 10px rgba(0, 0, 0, .2);
}
</style>
<?php
}
?>
<?php
// Template header color
if ($this->params->get('headerColor'))
{
?>
<style type="text/css">
.header
{
background: <?php echo $this->params->get('headerColor');?>;
}
</style>
<?php
}
?>
<!-- Sidebar background color -->
<?php if ($this->params->get('sidebarColor')) : ?>
<style type="text/css">
.nav-list > .active > a, .nav-list > .active > a:hover
{
background: <?php echo $this->params->get('sidebarColor'); ?>;
}
</style>
<?php endif; ?>
<!--[if lt IE 9]>
<script src="../media/jui/js/html5.js"></script>
<![endif]-->
</head>
<body class="admin <?php echo $option . " view-" . $view . " layout-" . $layout . " task-" . $task . " itemid-" . $itemid . " ";?>" <?php if ($stickyToolbar) : ?>data-spy="scroll" data-target=".subhead" data-offset="87"<?php endif;?>>
<!-- Top Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<?php if ($this->params->get('admin_menus') != '0') : ?>
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<?php endif; ?>
<a class="brand" href="<?php echo JUri::root(); ?>" title="<?php echo JText::sprintf('TPL_ISIS_PREVIEW', $sitename);?>" target="_blank"><?php echo JHtml::_('string.truncate', $sitename, 14, false, false);?> <i class="icon-out-2 small"></i></a>
<?php if ($this->params->get('admin_menus') != '0') : ?>
<div class="nav-collapse">
<?php else : ?>
<div>
<?php endif; ?>
<jdoc:include type="modules" name="menu" style="none" />
<ul class="<?php if ($this->direction == 'rtl') : ?>nav<?php else : ?>nav pull-right<?php endif; ?>">
<li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#"><?php echo $user->name; ?> <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class=""><?php echo JText::_('TPL_ISIS_EDIT_ACCOUNT');?></li>
<li class="divider"></li>
<li class=""><?php echo JText::_('TPL_ISIS_LOGOUT');?></li>
</ul>
</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
</nav>
<!-- Header -->
<?php
if ($displayHeader):
?>
<header class="header">
<div class="container-fluid">
<div class="row-fluid">
<div class="span2 container-logo">
<a class="logo" href="<?php echo $this->baseurl; ?>"><img src="<?php echo $logo;?>" alt="<?php echo $sitename; ?>" /></a>
</div>
<div class="span10">
<?php if (isset($app->JComponentTitle)) : ?>
<h1 class="page-title"><?php echo JHtml::_('string.truncate', $app->JComponentTitle, 0, false, false);?></h1>
<?php else : ?>
<h1 class="page-title"><?php echo JHtml::_('string.truncate', '', 0, false, false);?></h1>
<?php endif; ?>
</div>
</div>
</div>
</header>
<?php
endif;
?>
<?php
if ((!$statusFixed) && ($this->countModules('status'))):
?>
<!-- Begin Status Module -->
<div id="status" class="navbar status-top hidden-phone">
<div class="btn-toolbar">
<jdoc:include type="modules" name="status" style="no" />
</div>
<div class="clearfix"></div>
</div>
<!-- End Status Module -->
<?php
endif;
?>
<?php
if (!$cpanel):
?>
<!-- Subheader -->
<a class="btn btn-subhead" data-toggle="collapse" data-target=".subhead-collapse"><?php echo JText::_('TPL_ISIS_TOOLBAR');?> <i class="icon-wrench"></i></a>
<div class="subhead-collapse collapse">
<div class="subhead">
<div class="container-fluid">
<div id="container-collapse" class="container-collapse"></div>
<div class="row-fluid">
<div class="span12">
<jdoc:include type="modules" name="toolbar" style="no" />
</div>
</div>
</div>
</div>
</div>
<?php
else:
?>
<div style="margin-bottom: 20px"></div>
<?php
endif;
?>
<!-- container-fluid -->
<div class="container-fluid container-main">
<section id="content">
<!-- Begin Content -->
<jdoc:include type="modules" name="top" style="xhtml" />
<div class="row-fluid">
<?php if ($showSubmenu) : ?>
<div class="span2">
<jdoc:include type="modules" name="submenu" style="none" />
</div>
<div class="span10">
<?php else : ?>
<div class="span12">
<?php endif; ?>
<jdoc:include type="message" />
<?php
// Show the page title here if the header is hidden
if (!$displayHeader):
?>
<h1 class="content-title"><?php echo JHtml::_('string.truncate', $app->JComponentTitle, 0, false, false);?></h1>
<?php
endif;
?>
<jdoc:include type="component" />
</div>
</div>
<?php if ($this->countModules('bottom')) : ?>
<jdoc:include type="modules" name="bottom" style="xhtml" />
<?php endif; ?>
<!-- End Content -->
</section>
<?php if (!$this->countModules('status') || (!$statusFixed && $this->countModules('status'))) : ?>
<footer class="footer">
<p align="center">
<jdoc:include type="modules" name="footer" style="no" />
© <?php echo $sitename; ?> <?php echo date('Y');?></p>
</footer>
<?php endif; ?>
</div>
<?php if (($statusFixed) && ($this->countModules('status'))) : ?>
<!-- Begin Status Module -->
<div id="status" class="navbar navbar-fixed-bottom hidden-phone">
<div class="btn-toolbar">
<div class="btn-group pull-right">
<p><jdoc:include type="modules" name="footer" style="no" />
© <?php echo $sitename; ?> <?php echo date('Y');?></p>
</div>
<jdoc:include type="modules" name="status" style="no" />
</div>
</div>
<!-- End Status Module -->
<?php endif; ?>
<jdoc:include type="modules" name="debug" style="none" />
<?php if ($stickyToolbar) : ?>
<script>
(function($){
// fix sub nav on scroll
var $win = $(window)
, $nav = $('.subhead')
, navTop = $('.subhead').length && $('.subhead').offset().top - <?php if ($displayHeader || !$statusFixed) : ?>40<?php else:?>20<?php endif;?>
, isFixed = 0
processScroll()
// hack sad times - holdover until rewrite for 2.1
$nav.on('click', function ()
{
if (!isFixed) setTimeout(function () { $win.scrollTop($win.scrollTop() - 47) }, 10)
})
$win.on('scroll', processScroll)
function processScroll()
{
var i, scrollTop = $win.scrollTop()
if (scrollTop >= navTop && !isFixed)
{
isFixed = 1
$nav.addClass('subhead-fixed')
} else if (scrollTop <= navTop && isFixed)
{
isFixed = 0
$nav.removeClass('subhead-fixed')
}
}
})(jQuery);
</script>
<?php endif; ?>
</body>
</html>
Thank You In Advance
It might be injected into <jdoc:include type="head" />.
Try removing this line, for debugging purposes and see if the 'malicious' CSS is still present.
If not, then the code is infact injected into this Joomla include. To edit that file being called by Joomla, head over to:
/libraries/joomla/document/html/renderer/head.php
and try searching for anything out of the ordinary.
If you for some reason don't want to manually fix this problem, try re-installing Joomla onto the already existing website (be-careful not to overwrite your current configs, database and template), which I'm sure will fix this problem.
If you can't see it in the files, neither can we...
There are hundreds of files that the hacker may have altered.
It seems as if it is something within the template, but it could be as simple as a plugin for the administrator.
Use the Inspect Element in Firefox or Chrome, and remove the HTML style. Login to your administrator, and keep on manually removing the HTML style, until you find out what the hacker did.

WordPress - Missing SideBar and Footer

Excuse my ignorance, I am very new to the web scene. I am missing a sidebar and footer on my custom theme. I was able to get the background images to appear for the header and content, but not for the footer and sidebar. I have followed several tutorials, researched to both ends of the internet and cannot figure out what I am doing wrong.
I am attempting to create a layout that consists of a header, content and right sidebar. I really don't want anything in my side bar from WordPress. I am going to put the site navigation and login there, but I would like the background to show up! I will post the basic code below and give the link to my site here. Thanks in advance!
index.php
<div id="container">
<div id="content" role="main">
<?php
/* Run the loop to output the posts.
* If you want to overload this in a child theme then include a file
* called loop-index.php and that will be used instead.
*/
get_template_part( 'loop', 'index' );
?>
</div><!-- #content -->
</div><!-- #container -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>
header.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php
/*
* Print the <title> tag based on what is being viewed.
*/
global $page, $paged;
wp_title( '|', true, 'right' );
// Add the blog name.
bloginfo( 'name' );
// Add the blog description for the home/front page.
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) )
echo " | $site_description";
// Add a page number if necessary:
if ( $paged >= 2 || $page >= 2 )
echo ' | ' . sprintf( __( 'Page %s', 'twentyten' ), max( $paged, $page ) );
?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url');?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
if ( is_singular() && get_option( 'thread_comments' ) )
wp_enqueue_script( 'comment-reply' );
wp_head();
?>
</head>
<body <?php body_class(); ?>>
<div id="wrapper" class="hfeed">
<div id="header">
<div id="masthead">
.......
</div><!-- #masthead -->
</div><!-- #header -->
<div id="main">
sidebar.php
<div id= "sidebar" class="widget-area" role="complementary">
</div><!-- #sidebar -->
footer.php
</div><!-- #main -->
<div id="footer" role="contentinfo">
</div><!-- #footer -->
</div><!-- #wrapper -->
<?php wp_footer(); ?>
</body>
</html>
style.css
/*
Theme Name: Mod Theme
Theme URI: http://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/
Description: My First Theme
Version: 1.0
Author: Jason
Author URl: http://www.itssimplydesign.com
*/
/* =Layout
-------------------------------------------------------------- */
/*
LAYOUT: Header, Content and Sidebar
DESCRIPTION:
*/
body {
background-color: #e6e9Df;
}
#container {
float: left;
margin: 0 -240px 0 0;
width: 100%;
}
#header {
background: url(http://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images/background_main_01.png) no-repeat;
width: 1000px;
height: 332px;
}
#sidebar {
background: url(http://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images/background_main_03.png) no-repeat;
float: right;
clear: right;
overflow: hidden;
width: 300px;
}
#content {
background: url(http://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images /background_main_02.png) no-repeat;
min-height: 668px;
width: 700px;
float: left;
}
#footer {
clear: both;
width: 100%;
}
You have applied background on the content but nothing is there for the footer.
You can either change to styling of the footer in your css, or you can put
<div id="footer" role="contentinfo">
</div>
in #container too. Then, it would all be included in the same div and the background would apply too.
Similarly, you can include the sidebar like that, in the container only.

Categories