How to fix non existent field in Gatsby GraphQL? - wordpress

I use Wordpress, Gatsby + GraphQL and I want to build a blog. Unfortunately all blog posts needs to have all "features" for example featured image.
The problem is when I remove all posts. So my blog is now empty but gatsby build fails because it expects featured image to exists. The same problem is if I have posts but they do not have featured image. If I want to run gatsby successfully I need at least one post with featured image.
Example GraphQL query
{
allWordpressPost {
    edges {
      node {
        id
        title
        content
        featured_media {
          source_url
        }
      }
    }
  }
}
Error
GraphQLError: Cannot query field "featured_media" on type "wordpress__POST".
I'm worried because my only solution is to create a dummy post with all these things. What if I want to create a blog for my client and he deletes this dummy post? Is there a better way?
I don't have much experience with gatsby so I would be happy for suggestions.
Thank you

I had a similar issue that I was able to work around, but without seeing more of your code this is just a guess. When you render the data in your Post template file you can do a "not null" check. It could look something like {data.featured_media !== null ? (<img src={{ data.source_url}} /> ) : null }

Related

how to customize post meta in wordpress?

currently my theme on WordPress is Neve , and my posts all over the blog shows the following meta info :
https://i.stack.imgur.com/ynu71.jpg
where :
1- post title
2- post author
3- post date
4- post category
i want to replace these post meta with similar to this:
https://i.stack.imgur.com/Xywa9.jpg
for this purpose i have created a child theme and then installed snippet plugin to add php code easily and deactivate it once it is not working . unfortunately i could not find the code that can do the required modifications on that post meta :
https://i.stack.imgur.com/uwCrS.jpg
can any one provide a full php code to modify all these changes in one time after pasting into snippet ? or if there is another way i can do it ?
You'll have to create a child theme (already done) where you can override the current blog post template, instead of using a snippet plugin. To do this, copy the blog post template file from your theme and add it to your child theme.
WordPress will now read your child theme template instead of your theme's template, and you can easily modify the DOM from there, and shape the layout/text however way you want. (You can use the theme editor built-in in WordPress to modify the new child theme file. No plugin required.)
This is the proper way to modify a post page without plugins, and you can easily grab thing such as a post date, author, etc. via WordPress' built-in function. Example of how to get the author name of a WordPress post in PHP.
As for, 'latest edition' date, I will lend you a snippet I wrote for a client as WordPress. This will return the date at which a post has been modified as long as it is different from the publishing date (tweaks are common right after publication so it's a tad pointless to show a "last edited date" as the same as the publication date).
function current_post_last_edited_date_formatted() {
if(get_the_modified_date() !== get_the_date()) {
return '<p class="last-edited"> Last edited <span class="data">'.current_post_last_edited_date().'</span></p>';
} else {
return '';
};
}
The function you see called in the condition are WordPress core functions. =)

Gatsby: Allow non-existing fields in GraphQL Queries

I'm using Gatsby with the Wordpress source plugin. So far so good. But the thing is I am querying fields that might or might not be there, in this case, the featured image of a post.
Here is my query:
{
allWordpressPost(sort: { fields: [date] }) {
edges {
node {
title
excerpt
slug
featured_media
better_featured_image {
wordpress_id
alt_text
caption
description
media_type
post
source_url
}
}
}
}
}
It works well when the featured image is set, but fails miserably otherwise.
And so my question: Is there any way in GraphQL to query an optional field? To add a default value to a required field?
I am all too new to GraphQL so I'm not even sure that's possible at this point.
Thank you.
This article explains the back story, but in short, you need to make sure that at least 1 of your WordPress posts has the featured image. Then the better_featured_image field will always exist.
In javascript, if you try to access allWordpressPost.edges.node.better_featured_image.wordpress_id and better_featured_image does not exist, you'll get a syntax error.
Without knowing what "fails miserably" specifically means, not sure what else to suggest.

Custom Plugin for wordpress with hierarchy of SEF pages

Here's my issue. My company needs a vendor database added to our wordpress website. None of the existing plugins will even come close to what we need, and we already have a mysql database with all of our information, so we need to create a plugin or something to do what we need.
These urls need to be direct-accessible and have SEF urls. So, for example:
mysite.com/vendors/
mysite.com/vendors/pipe-manufacturers/
mysite.com/vendor/bobs-pipes/
And, the custom content needs to appear inside the wordpress template.
There are really 2 options:
1) Find a way to write our application outside of wordpress, but find a way to bootstrap wordpress to show the header, footer, and sidebar.
2) Run the app from inside wordpress.
So I went for option #2. I created a new template file named "vendor.php", and began working. I added this code to my functions.php of my theme:
add_filter( 'template_include', 'xyz_template_check' );
function xyz_template_check() {
global $template;
$rqst = $_SERVER['REQUEST_URI'];
$ra = split("/", $rqst);
if ($ra[1] == "vendors") {
$template_file = get_stylesheet_directory() . '/vendors.php';
return $template_file;
}
return $template;
}
So what the above code does, if it sees the word "vendors" as the first part of the url after the site name, it sends you to vendor.php. This works PERFECTLY....
except...
Wordpress believes that the page is not found. It returns a 404 header, and NOT FOUND into the page title and breadcrumb.
Adding a PAGE called "Vendor Database" with the permalink "/vendors/" fixes the main page. But there will be literally hundreds of vendors and different categories. I cant be creating a custom page for each one. This needs to be dynamic.
So, how do I make wordpress give a 200, and supply an acceptable page title, breadcrumb, etc.
Don't even get me started on the danged wp_title filter. This did NOT work as documented. Although, it just occurred to me that this might be an issue with Wordpress SEO (the wp_title filter issue).
Anyone got an idea on this?
Ok got this. The solution was to use the rewrite api, as mentioned above, to look for the pattern /vendors/, letting it know that it was a valid URL. Coupled with my existing template override, this is what I needed.

Wordpress custorm URL variables causes strange redirect

I'm trying to have custom variables in my URL for Wordpress site. I have read up as much as I could find on the subject and so far have the following in my functions page:
function add_query_vars($aVars) {
$aVars[] = "mrdrct";
return $aVars;
}
// hook add_query_vars function into query_vars
add_filter('query_vars', 'add_query_vars');
And the following on my header page:
if(isset($wp_query->query_vars['mrdrct'])) {
$mVar = $wp_query->query_vars['mrdrct'];
echo "variable is $mVar <br />";
}
Just to test out if things are being passed correctly and they are. However, when I use a link with the url variable in it - say www.mydomain.com/?mrdrct=myVarable - I am not directed to my homepage of my Wordpress site which is set to a static page with a template on it - I am instead directed to a page with my latest posts on it. I cannot figure out why this is happening - any ideas? Hopefully I've explained this well enough.
Thanks.
When WP sees a query string (? after the URL) it will attempt to display matching posts using it's rewrite rules. If no posts match it will show a 404 error - I would guess you do not have a 404.php file, so WP is showing the default which is index.php (see the Wordpress Template Hierarchy for more details on that).
I'm not 100% sure what you want to achieve, but I'd suggest that you need to look at changing the query when $wp_query->query_vars['mrdrct'] is set. See the WP Codex for query_posts() for a good place to start, if you are not already familier with it.

Wordpress post into Jquery mobile framework

I want to show my wordpress post into jquery mobile application... But so far i didnt got the success. I am using jquery.post() function but my response comes empty....
Request to the desired url goes well , status comes 200 ok but response coming is always blank :( Although the same post function & url is working fine in other php pages....
below is my code
function get_Time(cityCode,date){
jQuery.post(
"http://test.local/time/",
{ city: cityCode, date:date},
function (data){jQuery('#print_time').html(data);}
);
}
function _get_Time(response)
{
alert("response:"+response);
var time = new Array();
time = response.split('|')
jQuery("#print_time").html(time[0]);
}
Please give me some solution for showing my wordpress post (only text + links) content into my jquery mobile applicaton....
I am not sure about what you are going to do. It seems to me, like you want to retrieve a certain WordPress post content + additional information via Ajax, I think the easiest way to do it is the following:
Write a custom server-side PHP-Script (which possibly takes a WordPress Slug or ID)
Create a connection to the database in this script, get the post contents you want to have and return these as text or JSON to your JQuery mobile and use it
It might work in a way like this (not tested):
include ‘path-to-wp-directory/wp-blog-header.php’;
$post_id=0;
if(isset($_REQUEST['post_id'])) {
$post_id=intval($_REQUEST['post_id']);
}
global $wpdb;
$post_content = $wpdb->get_var("SELECT post_content FROM $wpdb->posts WHERE post_id=".$post_id." AND post_status='publish'";
echo $post_content;
This is only possible if you have access to the server, of course. If you want to get Post Content from an external WordPress Blog, then you should consider using the RSS Feed.
The following article shows how to load WordPress functions in an external PHP Script, which also might be useful: http://www.bloggingtips.com/2009/01/25/use-wordpress-functions-externally/

Resources