I have a custom template that I am using in my website. To the right of my pages I have a position with a background color that I do not want to display on my terms of use page. The position contains a twitter module which I can remove from the page but I am still left with a small box containing the background color from the css. Can I completely remove this position from just the terms of use page.
In your Terms of use page, add a custom class say terms-of-use and then override it with background: transparent
The dynamic custom class can be generated through Adding custom class on Joomla pages
CSS
body.terms-of-use .social {
background: transparent;
}
Output:
You can edit the html template, look for the place where the module is shown in the index.php will be like this ...
<jdoc:include type="modules" name="social" style="none" />
And add some code in PHP, so that only the module is displayed, when the module is published. In this way joomla will not write anything if there is no content to show and will not need to do anything in the CSS, besides improving the loading of the page.
<?php if($this->countModules('social')) : ?>
<jdoc:include type="modules" name="social" style="none" />
<?php endif; ?>
Related
I've a WP site with the Enfold-child theme. For the header, I choose to place the company logo upper left and main menu under the company logo. I would like to add an image on the right of the company logo but I don't try to do this.
Last part of header.php is the following
<?php
if(!$blank) //blank templates dont display header nor footer
{
//fetch the template file that holds the main menu, located in includes/helper-menu-main.php
get_template_part( 'includes/helper', 'main-menu' );
} ?>
<div id='main' class='all_colors' data-scroll-offset='<?php echo avia_header_setting('header_scroll_offset'); ?>'>
<?php
if(isset($avia_config['temp_logo_container'])) echo $avia_config['temp_logo_container'];
do_action('ava_after_main_container');
?>
Have I to modify this file to add the image? Can you help me, please?
Thanks!
try this. It's a Knowledgebase article from Enfold detailing how to add a Widget area to the header for adding custom code, ie an image.
It's what we use to do exactly that.
: http://www.kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
if you do not want to touch the header.php you may consider using a css ::after selector
I've run into a small problem coding my own WP theme from scratch (with a static Home page and a separate Blog page). I can't change the font-color of my blog posts (that display after I click them). So I have a two-part question:
Why can't I get the_content to change color on my single.php page? Here's my code:
<?php
get_header();
the_post();
if ( has_post_thumbnail() ) {
the_post_thumbnail('large');
}
?>
<div class="white">
<div class="container">
<h2 class="black-text light" style="margin:0;">
<?php the_title();?>
</h2>
<h5 class="black-text" style="margin:0 0 7% 0;">
<?php the_author();?>
</h5>
<p class="black-text">
<?php the_content();?>
</p>
</div>
</div>
<?php
get_footer();
?>
What's happening is on my single.php page (which I'm using to design my individual blog posts), I've put 'the_title();' in an <h2>, 'the_author();' in an <h5>, and 'the_content();' in a <p>. I've also told each of those elements to show as black text. However, only the <h2> and <h5> change to black text. When I inspect it with Dev Tools, what's happening is WP is ignoring my hard-coded <p>, and creating new <p> of its own WITHOUT the black-font formatting.
My second question:
Am I even doing this right?? It displays fine on my local development, but am I doing this all in the correct way? Basically, I have a front-page.php that displays my Home Page. Then I have an index.php that shows the main blog page with small excerpts. Then, when a user clicks on a single blog post to open it, the individual post is shown with the single.php template. Is this right?
If a reference would help, you can see it here: www.uptowndownentertainment.com/blog
The code is missing from your post, you need to indent it with four spaces to make it show up. Looking at this page you seem to have added this before the content:
<p class="black-text" style="color:black !important;">
But the actual text is inside another paragraph element so it's not affected by that code. Wordpress automatically does this when writing posts. The easiest solution might be to add this to your style.css:
.container p {
color: black;
}
And then remove the style markup from the headers and paragraphs. It's always better to keep styles in the CSS instead of right in the code.
I've added a set of border stylings to my media attachment page using Advanced Custom Fields. What I want is to be able to select one of these options and add the relevant style as a class to the attached image.
For example: a blogger can create a post and mix and match different stylings to the images without knowing any CSS or HTML. I've attached a screenshot of the attachment page.
I've been investigating this and it seems like it has to do with attachment_fields_to_edit or attachment_fields_to_save filters, but I can't put it all together.
http://imgur.com/XW42bLo
So ideally, if I were to select the Green Border option the image in the post would have a "green-border" class.
Apologies if I'm misunderstanding the question, but could you not just do:
<?php
$style = get_field('border_options');
?>
<div class="<?php echo $style . '-border'; ?>">
Content
</div>
?
I'm new here, this is my fist question, but I've performed research and can't find the answer.
I'm developing a Wordpress site and hacking a template that uses masonry with summaries and thumbnails on a grid on the index page. When you click on an image you're directed to the post content. This is the theme: http://jinsonathemes.com/fabs/?themedemo=Vasiliki
What I'd like to implement is this:
When the user clicks on the thumbnail, the content is revealed and expanded on the same page. Here's an example from Up Magazine: http://upmagazine-tap.com
I looked at the JQuery script on this very cool Fiddle (#FS34t). The boxes expand and collapse content on click, but that's not quite what I have in mind for this site. Will definitely implement on another.
I thought it would be an easy show /hide function, but each image is linked to a specific post using the same "content" div. How would I use an image in a masonry grid as the trigger for an expand/collapse of content of the respective post -- as in the Up Magazine sample?
Thank you for reading.
I would add the_content to the post div in its own child div. Then hide that div in the css.
Then I would create a function that opens up that div [I'd use jQuery slideDown()]. The function would also include the masonry reload method [.masonry( 'reload' )] in that function.
I would then bind that function to a click on the div, or perhaps the post thumbnail.
Very roughly:
html
<div class="post">
<?php the_post_thumbnail() ?>
<div class="excerpt"><?php the_excerpt() ?></div>
<div class="post-content"><?php the_content() ?></div>
</div>
the css
div.post-content {
display: none;
}
js
$('.classofpostthumbnail').click(function() {
$(this).siblings('.excerpt').slideUp();
$(this).siblings('.post-content').slideDown();
$('.masonrycontainer').masonry('reload');
});
However my js could definitely be improved. [For starters chain the slides with their callbacks so that all the animations run after each other. And of course your html and css will probably be a lot more complicated.
Well ... UpMagazine does not have hidden content on div's we load content into the container with AJAX sending requests to /wp-admin/admin-ajax.php (see: http://core.trac.wordpress.org/browser/trunk/wp-admin/admin-ajax.php ).
Glad you liked the website.
Hey I have a wordpress blog, and I need to add some negative margin on the sidebar on the index page, but not on any other page, the trouble is since the sidebar is in "sidebar.php" and the head element is in "header.php" so I can't use inline styles or styles just for that page.
Any ways of achieving this?
I would assume a PHP if statement in the header?
For the moment I've used a style element within the body.
I haven't used wordpress in some time, but from what I remember, there was a specific home/index template... You could wrap the sidebar in a tag and sub-reference that through css.
css:
#sidebar-fix #sidebar element {...}
html:
<div id="sidebar-fix"><?#sidebar include?></div>
You can use the is_page function to single out the page you want. Here is an example and a link.
<?php if (is_page('My Page')) { ?>
<style type="text/css">Your style here</style>
<?php } ?>
http://codex.wordpress.org/Function_Reference/is_page