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.
Related
I am trying to recreate a WordPress slider on Gatsby
I want to see if there is a way to query multiple images by id. I don't want to use many queries but a single one using an array of IDs - if it's possible of course :-)
What the query would be for example if I wanted the 110,200,250,300,400 media of the WordPress library?
Is it more efficient to add the images to my src folder?
Thank you!
I was strugling with similar thing and this query is what worked for me:
query MyQuery {
mediaItems(where: {in: [10, 12, 14]}) {
edges {
node {
sourceUrl
srcSet
}
}
}
}
Considering you are running latest plugin versions
Answer 1
Your query could look something like this:
query ImageQuery {
allWpMediaItem(filter: {databaseId: {in: [390, 164]}}) {
nodes {
localFile {
childImageSharp {
gatsbyImageData(layout: CONSTRAINED, formats: [AVIF, WEBP, JPG])
}
}
}
}
}
Obviously you have to adjust the image options to your needs.
Answer 2
If you actually want to define a set of images to return under a custom query you would need to extend the WPGraphQL schema and return the array of images. The easiest option I can think of is to create a Custom Post Type Slider and add a Repeater field through Advanced Custom Fields. Since ACF is supported with a WPGraphQL Extension it is pretty simple to add it to the schema. You just have to add the Post Type to the schema too. See the docs here: https://www.wpgraphql.com/docs/custom-post-types/
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 }
The registration form in the Buddypress auto generates html for the dynamic fields (such as name). How can I modify the label text (for example replace "(required)" with an * (asterisk).
If you're looking to make that type of change to BuddyPress profile fields, you can use these filters:
add_filter( 'bp_get_the_profile_field_name', function ($field_name){
if($field_name === 'Name') {
return 'Your Name';
}
return $field_name;
});
add_filter( 'bp_get_the_profile_field_required_label', function($string, $id) {
return '*';
});
If you're looking to make changes to those account fields on the left, it looks like you'll need to use a template file copied from BuddyPress into your theme. A bit more intrusive, but will work.
Copy this: buddypress/bp-templates/bp-legacy/buddypress/members/register.php
To here: /your-theme/buddypress/members/register.php
Hope this helps a bit! Customizing BuddyPress & WordPress markup can get stringy real fast, so I'd recommend tracing the code back to a filter or action if you can find one. If not, look for a template file you can bring into your own theme.
If I did not undestand you wrong, It depends if you want to do it in the client (with Javascript for example) or from the server (with the back-end languaje). But the common languajes have a replace() method that takes two arguments, usually strings with the text you want to replace and the one you want to replace it with.
This page explains the replace method:
https://www.w3schools.com/jsref/jsref_replace.asp
Hope it help
How do I hide labels that have empty fields when viewing the actual node of a certain content type?
I'd really appreciate anyone's help, thanks for your time.
Another way you could achieve this is by using a custom template file that would apply to all nodes of that content type.
Make sure that node.tpl.php exists in your sites/all/themes/[mytheme] directory first. This template must exist before other custom templates can be called.
Make a copy of your node.tpl.php and name it node--[contenttype].tpl.php (without the brackets).
If you have the Devel module enabled, you can throw a dpm($content); into the file to find out the name of the field you are trying to hide. Or you could look at the content type itself.
Once you have the name of the field, you can now insert this code before the print render($content); statement:
if (empty($content['my_field'])) {
unset($content['my_field']);
}
Clear the cache, and your field will only appear if there is a value stored.
By default, the labels of empty fields are hidden, maybe there's still a 'non breaking space' or some other leftover in the field?
You have to check the difference between an existing node where the problem occurs and a new node where you don't touch the particular field.
Set unwanted labels display hidden in nl/admin/structure/types/manage/selected_content_type/display
I would like to correct first answer. In node.tpl.php we should check #markup instead of field array:
if (empty($content['field_vac_req'][0]['#markup'])) {
unset($content['field_vac_req']);
}
instead of
if (empty($content['my_field'])) ...
If the content type has a lot of fields looping this worked for me:
foreach($content AS $key => $values) {
if (!empty($content[$key][0]['#markup'])) {
print render($content[$key]);
}
}
I'm using wordpress 3.1
I got 3 types of custom types : videos, galleries and podcasts. They use the default taxonomy categories.
When viewing a single custom post let's say a video, the next_post_link() (or previous_post_link) function works as planed but it links only to the next or previous post from this custom post type.
How could I get it to display the next post from any post type? tried to search hours on google without finding anything relevant to this. Anyone facing the same issue?
You'll need to remove the post_type clause from the SQL query used to retrieve the adjacent post. This can be done by hooking into the get_next_post_where and get_previous_post_where filters, although it's not ideal as the SQL query is passed as a single string.
add_filter('get_next_post_where', 'my_get_adjacent_post_where_filter');
add_filter('get_previous_post_where', 'my_get_adjacent_post_where_filter');
function my_get_adjacent_post_where_filter($sql) {
return preg_replace("/ AND p.post_type = '[^']*'/", '', $sql);
}