Project

General

Profile

Support #9175

Need to implement child theme on newlaborforum.cuny.edu

Added by Diane Krauthamer almost 2 years ago. Updated over 1 year ago.

Status:
Resolved
Priority name:
Normal
Assignee:
Category name:
WordPress Themes
Target version:
Start date:
2018-02-06
Due date:
2018-02-13
% Done:

0%

Estimated time:
2.00 h

Description

Hi, I have created a child theme for the site I administer, http://newlaborforum.edu. This theme includes code to add a necessary feature for the design of the site. Please let me know where to send the files and how I can proceed, thanks!

colormag.zip (2.21 MB) colormag.zip Diane Krauthamer, 2018-02-06 10:38 PM
newlaborforum-colormag-child.zip (1.47 KB) newlaborforum-colormag-child.zip Boone Gorges, 2018-02-08 05:13 PM
widgets.php (49.6 KB) widgets.php Diane Krauthamer, 2018-02-08 10:21 PM
functions.php (36.5 KB) functions.php Diane Krauthamer, 2018-02-08 10:21 PM
related-posts.php (2.1 KB) related-posts.php Diane Krauthamer, 2018-02-08 10:21 PM
widgets.php (49.6 KB) widgets.php Diane Krauthamer, 2018-02-10 07:13 PM
widgets.php (49.6 KB) widgets.php Diane Krauthamer, 2018-02-12 04:44 PM
newlaborforum-colormag-child.zip (7 KB) newlaborforum-colormag-child.zip Boone Gorges, 2018-02-13 10:48 AM
newlaborforum-colormag-child.zip (1.18 KB) newlaborforum-colormag-child.zip Diane Krauthamer, 2018-02-18 02:14 AM
colormagchild-screenshot.jpg (525 KB) colormagchild-screenshot.jpg Diane Krauthamer, 2018-02-18 02:17 AM
colormagchild-bylines-testsite.JPG (200 KB) colormagchild-bylines-testsite.JPG Diane Krauthamer, 2018-02-18 02:23 AM
colormagchild-bylines-LIVEsite.JPG (245 KB) colormagchild-bylines-LIVEsite.JPG Diane Krauthamer, 2018-02-18 02:24 AM
Screenshot_2018-02-19_14-40-27.png (403 KB) Screenshot_2018-02-19_14-40-27.png Boone Gorges, 2018-02-19 09:40 AM
newlaborforum-colormag-child.zip (2.15 KB) newlaborforum-colormag-child.zip Boone Gorges, 2018-02-21 10:18 PM
widgets.php (49.7 KB) widgets.php Diane Krauthamer, 2018-02-28 10:39 PM
newlaborforum-colormag-child.zip (5.48 KB) newlaborforum-colormag-child.zip Boone Gorges, 2018-03-20 05:53 PM

History

#1 Updated by Boone Gorges almost 2 years ago

  • Category name set to WordPress Themes
  • Status changed from New to Reporter Feedback
  • Assignee set to Boone Gorges
  • Priority name changed from Immediate to Normal
  • Target version set to 1.12.8

Hi Diane - You can find fairly detailed information at https://dev.commons.gc.cuny.edu/hosting-partner-handbook/, especially under section 3. Briefly, though, you can either (a) attach a zip here, or (b) give me a link to a public repository (like on GitHub) + a specific changeset # (so I know which version to look at).

Please be sure to do this a few days before a scheduled release so that I've got time to review. https://dev.commons.gc.cuny.edu/release-schedule-and-procedures/ Our next release is next Tuesday, Fe 13.

Let me know if you have questions!

#2 Updated by Diane Krauthamer almost 2 years ago

I have included the ZIP file here. Would you please let me know when you are able to review, and if you have any questions for me? I would like for this to be implemented for the next release on Feb. 13.

#3 Updated by Boone Gorges almost 2 years ago

Hi Diane - It appears that you've sent a modified version of the colormag theme, rather than a child theme. Generally, if you're only making minor modifications, we'd prefer you to create a true child theme. This way, when we update the main Colormag theme in the future, you'll automatically receive those updates.

As for the specifics, it appears that your only changes are in the function `colormag_entry_meta()`. The way that functions in Colormag's inc/functions.php file are written is what WP calls "pluggable". Because they're wrapped in a function_exists() checks, you can put a modified version of the function into your child theme's functions.php file, and it will be used instead of the version of the function that comes with Colormag. So you child theme would like this:

1. A style.css with nothing but a header (defining theme name, parent, etc) and an import statement for the Colormag CSS file
2. A functions.php file with nothing but your own version of the `colormag_entry_meta()` function

https://premium.wpmudev.org/blog/how-to-create-wordpress-child-theme/ is a pretty good guide on getting a child theme set up. Let me know if you have questions.

#4 Updated by Diane Krauthamer almost 2 years ago

Hello,
I am new to creating child themes, so I have to admit I am a little confused. Actually, I thought what I had sent was a child theme. Can you tell me what specifically would have to be different about what I sent vs. what I need to send? Would the style.css and functions.php files replace the files currently being used? Also, what would the import statement for the Colormag CSS file look like? I know it's not your job to write the code, but I could use a little help with this.

#5 Updated by Boone Gorges almost 2 years ago

The child theme would consist only of the style.css and functions.php file.

In general, child themes contain only the template files that you want to override. Those that are absent are inherited from the parent theme.

I recommend reading through the article I sent, especially the section "How Child Themes Work And Why Use Them" - it gives a fairly brief summary of the mechanics.

#6 Updated by Diane Krauthamer almost 2 years ago

So, should I only submit those two files in the ZIP file?

#7 Updated by Boone Gorges almost 2 years ago

Hi Diane - I've attached a zip file of what I think you need in your child theme. This is based on the scan that I did of the colormag zip you originally sent, which indicated that the only change you'd made was to colormag_entry_meta() function. If I've missed something, then the child theme would need to be adjusted accordingly.

I'd encourage you to look at the structure of the child theme as I've created it, and look at it side-by-side with the article I linked to above. It should help give a sense of what child themes are and how they operate in WordPress. This is important information if you plan to maintain this theme on the Commons in the future.

Please install the theme locally and test to ensure that it's working the way you'd expect.

#8 Updated by Diane Krauthamer almost 2 years ago

Hi,
OK I think I understand what you need from me now. The template files that I want to override are actually a few file files:
inc/functions.php
inc/related-posts.php
inc/widgets/widgets.php

I should be able to update the CSS styles from the Wordpress interface.
I have attached these three files here. Could you tell me if this is what you would need? Do you think I should include the new style.css file as well?

#9 Updated by Boone Gorges almost 2 years ago

Hi Diane - I'm afraid that WordPress's theme structure only allows you to override individual template files in a child theme, not arbitrary PHP files. The change in functions.php is possible because of the "pluggable" nature of the function in Colormag. And the related-posts template should be overrideable by placing it in an /inc/ directory in the child theme (as it's loaded with get_template_part()). But the widget change cannot be made in a child theme without some more advanced techniques (unhooking Colormag's versions and rehooking your own). The most straightforward technique is to register a copy of the widget in question, where your copy has the necessary changes. Here's more about how to register a widget in WordPress: https://code.tutsplus.com/tutorials/creating-your-own-widgets-using-various-wordpress-apis-introduction--cms-22460 You'd basically be copying over the widget class from the function, and then registering it in the way recommended by that page.

The alternative to this is to ship a modified version of the full Colormag theme (which is what you originally attached when you opened the ticket). But this requires that you and your team take responsibility for backporting all fixes from future Colormag releases (especially security fixes) to your forked theme. This is a fairly large amount of work on an ongoing basis, and I don't recommend it.

#10 Updated by Diane Krauthamer almost 2 years ago

Hi Boone,
Thank you for the info. What would be required to backport all fixes from future ColorMag releases to our forked theme? Sorry - again I am unfamiliar with how some of this works. I may be able to get my team to approve this amount of work, since I know that this change in code is very important to them. I would just need to understand what exactly would be involved so I can give an estimate of the hours.

I will also look into registering the widget in the meantime. If I get approval for the first option, would it be possible to implement this on Tuesday, Feb. 13th? At least for the functions.php and related-posts.php files?

Thank you again for your explanations.

#11 Updated by Boone Gorges almost 2 years ago

Yes, for the 13th, I can put up a child theme that includes the overrides for the related-posts.php template, as well as the pluggable function that you've modified in functions.php.

The option of backporting future fixes from ColorMag is likely out of the question. It's not just that it would require a great deal of time and effort. It would also require that a member of your team had the deep knowledge of PHP and WordPress themes in particular to be able to identify and correctly perform the backports. At worst, an incorrectly done fix could result in data loss on the Commons, so it's something we need to guard carefully against.

Please have a look at the documentation for creating WordPress widgets, and let me know if you have questions.

#12 Updated by Diane Krauthamer almost 2 years ago

Thank you for your help with this. It looks like the code in the widgets.php file already includes code that registers the widgets contained in the file. I am not sure what else would be needed. Would you be able to take a look at the file and let me know? If the current file does already register the widgets, how would I be able to implement this on the site?

#13 Updated by Boone Gorges almost 2 years ago

Hi Diane - Yes, the ColorMag theme is registering its own widget. But your child theme will have to register its own widget, which will be a duplicate of the ColorMag one, except with the minor changes you need made. So, briefly:

- Find the classes responsible for creating the widgets in question in ColorMag's widgets.php
- Copy somewhere in your own child theme (functions.php should be fine)
- Change the class names of the widgets, so that they're unique, otherwise you'll get a PHP fatal error. I also recommend you change the name of the widgets as displayed in the Dashboard, so that it's obvious which one you should be adding. Eg, instead of "TG: Featured Posts (style 2)", call it "NLF Featured Posts (style 2)" or something like that
- Ensure that you are registering your own copies of the widgets. The way ColorMag does it around line 195 of widgets.php is something you can emulate in your own child theme.

#14 Updated by Diane Krauthamer almost 2 years ago

In the file: inc/widgets/widgets.php, updated the widget classes to new names and registered them:
Line 195: register_widget( "colormag_featured_posts_slider_widget" );
changed to
Line 195: register_widget( "nlf_featured_posts_slider_widget" );

Line 196: register_widget( "colormag_highlighted_posts_widget" );
changed to
Line 196: register_widget( "nlf_highlighted_posts_widget" );

Line 197: register_widget( "class_featured_posts_widget" );
changed to
Line 197: register_widget( "nlf_featured_posts_widget" );
----

Line 209: class colormag_featured_posts_slider_widget extends WP_Widget
changed to
Line 209: class nlf_featured_posts_slider_widget extends WP_Widget

Line 354: class colormag_highlighted_posts_widget extends WP_Widget
changed to
Line 354: class nlf_highlighted_posts_widget extends WP_Widget

Line 492: class colormag_featured_posts_widget extends WP_Widget
changed to
Line 492: class nlf_featured_posts_widget extends WP_Widget

Line 679: class colormag_featured_posts_vertical_widget extends WP_Widget
changed to
Line 679: class nlf_featured_posts_vertical_widget extends WP_Widget

#15 Updated by Diane Krauthamer almost 2 years ago

Sorry, for the previous comment I meant to add this: I have updated this file with changed widget class names. Would you be able to tell me if this is what is needed? Do I need to change all of the class names, or just the ones which alters from the original widgets?

#16 Updated by Boone Gorges almost 2 years ago

Hi Diane - The goal is not to make modifications in an existing file. It's to provide your own widget-registering code, in your own child theme file. Copy the relevant code into functions.php in your theme.

Are you doing this work with a local WordPress development site? If so, be sure that you're running the child theme on that local installation, so you'll be certain that the code you've provided is doing what you expect it to be doing.

#17 Updated by Boone Gorges almost 2 years ago

For this morning's release, I packaged the changes we have so far into a proper child theme. See attached. This theme will be made available on newlaborforum after release.

Diane, please feel free to follow up on this ticket as you work on the widget changes.

#18 Updated by Diane Krauthamer almost 2 years ago

Hi Boone,
Thanks so much. It looks like many aspects of the child theme are working, but I am a bit confused about the widgets.php file so far. Would it be possible to package this file with the new theme, or tell me what I need to do to make that happen? In the original Colormag theme the widgets file is separate from the functions file, so I'm confused about why these tw couldn't be packaged together in the child theme.

#19 Updated by Boone Gorges almost 2 years ago

Hi Diane - We cannot include the ColorMag widget file. It is already being included as part of the child theme inheritance, and including another version modified in the way that you've done will cause fatal errors due to duplicate function and class names.

You will need to register your own widgets in addition to the ColorMag ones. Your widgets can be mostly copied from ColorMag. Please see the instructions at https://redmine.gc.cuny.edu/issues/9175#note-13 for more details.

#20 Updated by Diane Krauthamer almost 2 years ago

Oh I see, so the new widget classes should be included in the functions file, not as a separate PHP file, correct? And submitted along with the original widgets.php file that was included with the original theme?

#21 Updated by Boone Gorges almost 2 years ago

Yes, loading them in the functions.php should be fine. You could put them into a separate file and include them if you wanted to, but that'd only be for your own organizational purposes. No need to send me the widgets.php file from the original theme - it's already loaded when your child theme is active.

#22 Updated by Diane Krauthamer almost 2 years ago

So here's something: I implemented the child theme that you sent onto my test site, and it seems that the widget classes were not needed.

My test site only seemed to inherit the style.css and functions.php files from the child theme - and nothing from the wp-content folder. I think that did the trick. I have attached the newlaborforum-colormag-child.zip folder with just those two files, and I am wondering if you can upload this as an updated child theme?

I have included a screenshot of the interface to show you what this looks like, for reference. Also, I have attached screenshots of the test site and the live site, which points to where the differences are. The test site is doing what the live site should be doing: including the guest authors as bylines, rather that the post's author.

Anyway, hopefully we're nearing the end of this complicated issue!

#23 Updated by Boone Gorges almost 2 years ago

My test site only seemed to inherit the style.css and functions.php files from the child theme - and nothing from the wp-content folder.

I'm not sure what you mean about wp-content - do you mean that there's nothing from colormag's /inc/ folder?

I have included a screenshot of the interface to show you what this looks like, for reference. Also, I have attached screenshots of the test site and the live site, which points to where the differences are. The test site is doing what the live site should be doing: including the guest authors as bylines, rather that the post's author.

I just took a few minutes to look at the source code. If I understand Co-Authors Plus correctly, it automatically filters post author listings if you put the following line in your functions.php:

add_filter( 'coauthors_auto_apply_template_tags', '__return_true' );

So, if I understand what you're trying to do, it should be sufficient to have nothing but that line in your functions.php - no other code necessary. This is something you should test locally.

I don't know why you're seeing the filtering happening locally. My guess is that you have modified your ColorMag parent theme locally to call the coauthors functions in the widgets.php file, while the version of the theme on the Commons does not have those mods.

#24 Updated by Diane Krauthamer almost 2 years ago

Boone Gorges wrote:

My test site only seemed to inherit the style.css and functions.php files from the child theme - and nothing from the wp-content folder.

I'm not sure what you mean about wp-content - do you mean that there's nothing from colormag's /inc/ folder?

Yes, I did not use the files that I had sent you from colormag's /inc/ folder, and this seemed to work just fine for my test site.

I have included a screenshot of the interface to show you what this looks like, for reference. Also, I have attached screenshots of the test site and the live site, which points to where the differences are. The test site is doing what the live site should be doing: including the guest authors as bylines, rather that the post's author.

I just took a few minutes to look at the source code. If I understand Co-Authors Plus correctly, it automatically filters post author listings if you put the following line in your functions.php:

[...]

So, if I understand what you're trying to do, it should be sufficient to have nothing but that line in your functions.php - no other code necessary. This is something you should test locally.

Thanks for the feedback. I did test this locally, but that code did not seem to take. What did work in the functions.php was the original code I had included, which was:
<span class="byline"><span class="author vcard"><i class="fa fa-user"></i><a class="url fn n" href="" title=""></a></span></span>

I don't know why you're seeing the filtering happening locally. My guess is that you have modified your ColorMag parent theme locally to call the coauthors functions in the widgets.php file, while the version of the theme on the Commons does not have those mods.

I will re-download the re-install the ColorMag parent theme locally and see what happens. Do you have any other ideas on what the problem might be?

#25 Updated by Boone Gorges almost 2 years ago

Hi Diane - I'm unsure what you're seeing locally, but I've just put a minor patch into the production site to confirm my theory. The functions.php file now consists of nothing but what you see in this: https://gist.github.com/boonebgorges/200a0dab2bb12a4fc6b6005f1793b44e

When I view http://newlaborforum.cuny.edu/ and unhide the links that you've hidden with CSS, I see what you see in the attached screenshot. I'm not 100% sure what you're trying to accomplish - I've tried to guess from the code you sent and some of the screenshots above - but I think it's working the way you want.

Unfortunately, I'm unsure what you might be doing locally to see something different.

#26 Updated by Diane Krauthamer almost 2 years ago

Hi Boone - yes, the screenshot that you attached is exactly what I am looking for! I don't know what I am doing locally that's different either, but whatever it is, I'm really glad to see the live version works. Would it be possible to implement your change, or have you already?

#27 Updated by Boone Gorges almost 2 years ago

The change is live on the site. For my internal purpose, the changeset is https://github.com/cuny-academic-commons/cac/commit/6f6e5a0279370a591a84b6a42606442300611197

I've attached a new zip that reflects the current state of the theme. I'd recommend getting your local versions running properly so that you can see the changes, as it'll like be necessary for you to do local testing for future fixes, etc.

Going to mark this as resolved, but please feel free to report back with other questions, either here or in a new ticket.

#28 Updated by Diane Krauthamer almost 2 years ago

Awesome!! Thank you, I appreciate all your work on this. We noticed one small bug in the code: when you click the author's name in the byline, it links to the admin's author page, not the co-author's page (i.e. if you click "Joshua Sperber's name on this post: http://newlaborforum.cuny.edu/2018/02/16/making-the-grade-rating-professors/ it directs you to this page: http://newlaborforum.cuny.edu/author/svalente/. It should link to this page: http://newlaborforum.cuny.edu/author/joshua-sperber/). Is there an easy fix to either have these link to the correct pages?

I can try to figure this out through the child theme and my local site, but of course if you have any ideas on an easy fix that would be great. Thanks!

#29 Updated by Boone Gorges almost 2 years ago

Hi Diane - At a glance, it looks like the reason is that the ColorMag theme uses the following code to generate the href:

 get_author_posts_url( get_the_author_meta( 'ID' ) ) 

Co-Authors Plus filters 'the_author_posts_link'. If ColorMag used `get_the_author_posts_link()` instead, then it would be properly filtered.

In theory, you could filter 'author_link' to fix this (this is the filter that's used in `get_author_posts_url()`. But this might be too general of a filter; it might modify values that you don't want modified. The other option is to override the ColorMag markup, as we discussed above, to replace the calls to `get_author_posts_url()` with a more appropriate function call.

#30 Updated by Diane Krauthamer almost 2 years ago

Hi Boone,
Thanks. How would I be able to filter the "author_link" ?
Alternatively, would we able to use an additional widgets file, as we discussed not long ago?: https://redmine.gc.cuny.edu/issues/9175#note-14. I already began working on this file (labeled nlfwidgets.php), and can complete it, test it on my local site, and send it to you to upload if that is what you think would be needed. Please let me know if that sounds like a good idea. Thanks!
Diane

#31 Updated by Boone Gorges almost 2 years ago

"Filters" are one of the basic concepts in WP theme development. Here's a good resource to get started thinking about it: http://www.wpbeginner.com/glossary/filter/

Reproducing the widget code would also be a fine alternative. Please let me know when you've got a version for me to have a look at.

#32 Updated by Diane Krauthamer almost 2 years ago

Thank you. I guess I am still unfamiliar with registering new widgets and getting them to appear in the "Widgets" area on the local site. I have made the necessary changes to the attached file and uploaded it to my local site, but the new widgets do not appear. Should I be adding an entirely new widgets.php file that includes both the changed and the unchanged code from the original widgets?? Also, how would I connect the widgets to the site interface? Do I need to somehow override the original file, or some areas of it? Would this involve the functions.php file?

#33 Updated by Boone Gorges almost 2 years ago

  • Status changed from Resolved to Testing Required
  • Target version changed from 1.12.9 to 1.12.11

Hi Diane -

I have implemented the widget override code, as requested. As described in https://redmine.gc.cuny.edu/issues/9175#note-13, I copied the relevant widget code to the child theme, into renamed widget classes, and then replaced Colormag's widget with these. In order to avoid unnecessary code duplication, I chose to extend Colormag's widget classes rather than replacing every single (unmodified) method. The Commons changeset is https://github.com/cuny-academic-commons/cac/commit/8d07afa80296ea71b40233e21705aa752a27e37f.

A zip file is attached. Please download it and have a look, both at the code and also to see that it does what you're expecting on your local installation. My impression from the discussions above is that all you're trying to accomplish is to override the text and link of the author attribution in various places to account for Co-Authors Plus, but this is largely implied from looking at the code that you originally provided. If it looks like there's something missing, please let me know.

Let me know if you've got questions or comments. If things look good, this will be part of the next release later in the month.

#34 Updated by Diane Krauthamer over 1 year ago

Hi Boone,
Thanks for working on this! I do not see a zip file attached to the comment, and when I attempt to visit the GitHub URL it shows a 404 error. Would you mind trying to re-send?
Best,
Diane

Boone Gorges wrote:

Hi Diane -

I have implemented the widget override code, as requested. As described in https://redmine.gc.cuny.edu/issues/9175#note-13, I copied the relevant widget code to the child theme, into renamed widget classes, and then replaced Colormag's widget with these. In order to avoid unnecessary code duplication, I chose to extend Colormag's widget classes rather than replacing every single (unmodified) method. The Commons changeset is https://github.com/cuny-academic-commons/cac/commit/8d07afa80296ea71b40233e21705aa752a27e37f.

A zip file is attached. Please download it and have a look, both at the code and also to see that it does what you're expecting on your local installation. My impression from the discussions above is that all you're trying to accomplish is to override the text and link of the author attribution in various places to account for Co-Authors Plus, but this is largely implied from looking at the code that you originally provided. If it looks like there's something missing, please let me know.

Let me know if you've got questions or comments. If things look good, this will be part of the next release later in the month.

#35 Updated by Boone Gorges over 1 year ago

Sorry about that - zip should be attached now.

#36 Updated by Diane Krauthamer over 1 year ago

Excellent! I tested this on my local site tonight and it works seamlessly. If you could implement it on the live site in the next batch of updates that would be great. I really appreciate all the work you have done for me on this site - you have been extraordinarily helpful! I will be in touch if there are any further technical issues, but I think with your update, the site should be good to go.

Best,
Diane

#37 Updated by Boone Gorges over 1 year ago

  • Status changed from Testing Required to Resolved

Sounds good, Diane. It'll be part of the next release.

#38 Updated by Diane Krauthamer over 1 year ago

Great, I look forward to it! What date will that be?

#40 Updated by Diane Krauthamer over 1 year ago

Excellent, thank you!

Also available in: Atom PDF