|
maueventespresso
|
January 6, 2017 at 7:06 am
We are trying to setup a custom template, as told
in de description below,
When I put the single-espresso-events.php
in the child-theme folder, the css does not seem to be loaded.
Is this a common error?
child theme folder
themes/twentytwelve-child/archive-espresso_events.php
themes/twentytwelve-child/content-espresso_events-shortcode.php
themes/twentytwelve-child/content-espresso_events.php
themes/twentytwelve-child/content-page.php
themes/twentytwelve-child/footable.standalone.css
themes/twentytwelve-child/footer.php
themes/twentytwelve-child/functions.php
themes/twentytwelve-child/header.php
themes/twentytwelve-child/style.css
discription:
Try downloading a copy of the templates to your computer.
Then upload them here:
/wp-content/themes/yourthemefolder
There are two files that will need to be deactivated since they are for the twenty fourteen theme:
archive-espresso_events.php
single-espresso_events.php
Change the name to this:
old-archive-espresso_events.php
old-single-espresso_events.php
Then duplicate a page.php theme template and rename to single-espresso_events.php. Now open that file for editing.
Towards the middle you should see a call for the content. That should be changed to this and save changes:
espresso_get_template_part( ‘content’, ‘espresso_events’ );
The next edit is for the archive-espresso_events.php file. Duplicate a page.php file and rename to archive-espresso_events.php. Then open the file for editing.
Change the call for content to this and save changes:
espresso_get_template_part( ‘loop’, ‘espresso_events’ );
Now you’ll have a handful of templates that can be edited
|
|
Tony
|
January 6, 2017 at 1:17 pm
Hi there,
Where do you find that documentation?
Is this a common error?
No but it depends solely on both your child and parent theme.
Before moving forward, do you want full control over the single event output or just specific sections?
If you can you let me know some specific on what your trying to do, there may be another, easier method to do what you need.
|
|
Josh
|
January 6, 2017 at 1:44 pm
Hi there,
Those steps seem unnecessary, and incorrect in a few places. May I ask what exactly you’re trying to accomplish by making custom templates? Many times you can use specific hooks and filters to make customizations without building sets of custom templates.
|
|
maueventespresso
|
January 7, 2017 at 2:39 am
What I want:
Event list page:
– an outline around each event in the list.
and control like margins, padding etc
– single event page
– also outline and control
see http://www.kingsmen.nl
|
|
Tony
|
January 9, 2017 at 3:48 am
Those sound like CSS changes to me, the above allows you to change the structure of the page which does not appear to be what you need.
For example:
article.espresso_events {
border: 1px solid #000;
padding: 20px;
margin: 10px;
width: 700px;
}
Applies a boarder, margins, padding and sets the width to match your ‘wrapper’ elements width for both the event list and single event page.
You can add the custom CSS to your site through the customizer.
Dashboard -> Appearance -> Customize -> Additional CSS.
|
|
maueventespresso
|
January 9, 2017 at 6:42 am
That’s great Tony,
01 Can you give a suggestion to how to find the CSS
of the elements
02 what if I want to remove or add an element,
lets say: an extra field to an event?
|
|
Tony
|
January 9, 2017 at 6:57 am
01 Can you give a suggestion to how to find the CSS
of the elements
You can use something like firebug:
https://www.youtube.com/watch?v=tdIk2PztcL0
Or Chrome Dev Tools.
02 what if I want to remove or add an element,
lets say: an extra field to an event?
You can usually hide elements with css by setting display: none;.
Adding new fields depends on what you want to ad and where however EE has plenty of hooks that allows you to add additional details if needed, what are you looking to add?
|
|
maueventespresso
|
January 10, 2017 at 2:20 am
i am familiar with dev tools
firebug has been replaced by dev -tools BTW
a problem for me is that I can’t find the element:
article.espresso.events
with firebug
|
|
maueventespresso
|
January 10, 2017 at 2:22 am
article.espresso_events {
border: 1px solid #000;
padding: 20px;
margin: 10px;
width: 700px;
}
BTW this CSS works!
|
|
Tony
|
January 10, 2017 at 4:00 am
i am familiar with dev tools
firebug has been replaced by dev -tools BTW
That it has, thank you.
Personally I use Chrome but either will work fine for this.
a problem for me is that I can’t find the element:
article.espresso.events
with firebug
Why are you looking for article.espresso.events?
You won’t find any elements with those classes, it needs to be:
article.espresso_events
|
|
maueventespresso
|
January 10, 2017 at 10:35 am
i ment article.espresso_events
I got it now, it was my lak of knowledge of CSS
|
|
Tony
|
January 10, 2017 at 12:39 pm
Great 🙂
Please do let us know if you have any further questions.
|
|
maueventespresso
|
January 11, 2017 at 12:46 am
Thank you very much,
i will post a new topic if/when modify question
pops up!
|
