I am trying to find the element ".widget, article " in my style.css for my theme. What happened was it shows on developer tools, but I can't find it in the style page.
The layout is for the background, and is white by default
The web developer tools says its layout is
<article>
<header class="entry-header">...</header>
<div class="entry-content clearfix">...</div>
...
The Styles page says its in index:156 of the theme
.widget, article {
background: #8C3737;
}
I can't find the article element or change the index.php file appropriately to make the background transparent.
Any ideas of how to echo the id for the article when it loads, or any other?
Related
When i create a new Post and write in the excerpt, the post image on the news page just dissappears . It only works if i have no excerpt. Also .. How can i create new posts with existing classes already written in my css?
Without the excerpt ir works just fine. Showing image and text that i add on the post.
My code
<section id="content">
<div class="content-wrap">
<div class="container clearfix">
<div class="row"> {% component 'blogPosts' %}
</div>
</div>
</div>
</section><!-- #content end -->
When not defining an excerpt, a summary attribute is appended to the model. See https://github.com/rainlab/blog-plugin/blob/master/models/Post.php#L344 . If your content starts with an image, it might be that the summary function kicks in and generates the image.
As for the CSS part
I think you're looking to override the partial set by {% componenent 'blogPosts' %}. As per the docs (https://octobercms.com/docs/cms/components#overriding-partials)
All component partials can be overridden using the theme partials. If
a component called channel uses the title.htm partial. We can override
the partial by creating a file in our theme called
partials/channel/title.htm.
Alternatively you can cmd / ctrl + doubleclick to expand the default component markup inside the CMS editor.
In this way you can edit your markup to match your theme.
If you want to override markup there is really easy way. for image #CptMeatball added proper answer you can check that out.
This way you have full control on mark-up and you can edit it.
1. Click on expand component it will reveal mark-up of component
2. Now you can add your own markup and edit it.
if any doubt please comment.
In my footer.php file, I have this bit of code towards the end of the file:
<?php wp_footer(); ?>
<div class="website-by">
<br>
Website by Gateway Web Design
</div>
</div>
</body>
As you can see, I've created a "website by" link, which links to another website when clicked on.
But I don't want this text, or the div that contains it, to appear at all on the home page of the site:
https://thehamburgercollection.com/
I've checked other stackoverflow articles that suggest doing so with JQuery, which I've added to my scripts.js file:
//hide link on the home page
document.ready(function() {
if (window.location.href.indexOf('https://thehamburgercollection.com/')) {
//Hide the element.
jQuery('.website-by').hide();
}
});
And I've also tried hiding the div on the home page with CSS that was suggested here:
.home .website-by {
display: none;
}
But unfortunately neither of these methods have worked. I've declared my class as website-by in the footer.php file, and have added the JQuery that should target that class in the scripts.js file, and have also added the suggested CSS. Any idea why either the JQuery or CSS code isn't working?
This is a WordPress website and a custom there. Any help / suggestions / education is appreciated!
I'm not a WordPress guru, but have you tried doing an if condition in the footer.php? if I got your question right, you need the .website-by to not appear elsewhere but the home page. Maybe something like
<?php wp_footer(); ?>
<?php if (!is_home()): ?>
<div class="website-by">
<br>
Website by Gateway Web Design
</div>
<?php endif; ?>
</div>
</body>
I have a Wordpress site and I want to change certain CSS values in the header.php on the index page only. I have a div which is 100% width and border bottom to add an underline to the header.php
<div class="nav">
...content to create nav-bar ...
<div class="hr"></div> <!-- remove on index.php -->
</div>
I don't want it to show, or affect anything on the index.php. (I don't want to target another header.php file for this one small thing)
Wordpress has a template tag called body_class which is used to create contextual CSS hooks.
<body <?php body_class(); ?>>
You can then use it in your CSS as follows:
.blog {}
.blog.home {}
/** if blog index is a page **/
.page.blog {}
see the documentation for the rather extensive list of possible output.
Usually, by default, in a Wordpress site, the body element has a home class for the front page.
So in your CSS you could try the following:
.home .nav .hr { display:none; }
I am working with Drupal 7 in a Zen 7.x-5.4 subtheme. I am attempting to add a primary navigation bar inside the header/banner area, to the right of the logo along the bottom.
I am not using the 'navigation' region provided as that sits below the header. Instead, I have added a menu block and placed it in the 'header' reagion. Unfortunately, it appears well below the header and logo.
Here is the pertinent html that is output:
<header id="header" class="header" role="banner">
<a id="logo" class="header__logo" rel="home" title="Home" href="/sandbox/">
<nav id="secondary-menu" class="header__secondary-menu" role="navigation">{this menu works fine}
<div class="header__region region region-header">
<div id="block-menu-menu-primary-nav" class="block block-menu first last odd" role="navigation">
<h2 class="block__title block-title">Primary Nav</h2>
<ul class="menu">{menu list here}</ul>
</div>
</div>
</header>
The menu that isn't where I want it lies in the region-header class. Any time I add a block to 'header' in the zen interface, it ends up in that class and appears below the header, not in it. The secondary menu, which is in the header by default, is fine and exactly where it should be. There is no css currently defined for region-header. header is 120px in height and has plenty of room for what I want to do. page.tpl.php offers little more than "print render($page['header']);" so I don't appear to have any control there.
I have 2 questions:
How can I get this menu up into the header where I want it?
How can I get it to hide the 'Primary Nav' title on the menu block? The title is required when creating a menu block and there does not appear to be a method for making it invisible.
Please let me know if there is any more specific information needed to answer these questions.
And, yes, I know similar questions have been asked, but they seem to apply to other versions of Zen and none I've found have been at all helpful.
It never fails. 3 days I've been trying to figure this out before posting a question and as soon as I post, I figure it out.
There was a css block in misc.css with the following
/* Wrapper for any blocks placed in the header region. */
.header__region {
/* Clear the logo. */
clear: both;
}
I just had to comment out the 'clear: both;' line as that was not allowing anything else to float next to the logo.
I was able to remove the menu title by going to 'configure block' and adding "" in the title there to override the title required when creating the menu.
Hopefully this will be of use to someone.
I am using drupal 7
views-view--myview.tpl.php sample code
<?php if ($rows): ?>
<?php print $rows; ?>
When i see this in firebug i see the structure
<div class="item-list">
<ul>
<li class="views-row views-row-1 views-row-odd views-row-first"> </li>
<li class="views-row views-row-2 views-row-even "> </li>
Now how do i inject a div in each of these li.. Is this possible without using jquery?
If you go the the "Edit" page for the view, you should see a link called "Theme: Information". It's under the "Style Settings" section. If you click this, you can see a list of all the possible template that your theme will look for when displaying the view. In bold will be the file it is currently using.
views-view--myview.tpl.php is to high up the chain to do what you want. If you want to inject a div (the same div) around each field you output, then I think the file views-view-field.tpl.php is what you are looking for.
The file contains just the line
<?php print $output; ?>
So there you can insert the desired div (after you copy it from views/themes into the template directory for your theme, of course).
If you investigate the Theme Information link some more it describes how to be even more specific in naming the view template files, for example if you wanted to theme a specific row differently you could use the file views-view-field--entity-id-X.
Hope that helps!
EDIT for comment
To go a different route, you can also edit the field settings for your view. Under the Field tab on the edit view page, you can click the links for each field. There is a Suffix setting available you could use to inject a div after the field is displayed.