convert post title to image

时间:2015-10-24 作者:user3646085

我正在尝试将文章标题转换为图像。我在主题文件夹image中创建了一个php文件。PHP带代码更新:工作代码

require_once($_SERVER[\'DOCUMENT_ROOT\'] . \'/wp-load.php\');
$postid = $_GET["postid"];
$string = get_the_title($postid);
$im = imagecreate(100, 30);
$bg = imagecolorallocate($im, 255, 255, 255);
$textcolor = imagecolorallocate($im, 0, 0, 255);
imagestring($im, 5, 0, 0, $string, $textcolor);
header(\'Content-type: image/png\');
imagepng($im);
imagedestroy($im);
我用

<img src="url/wp-content/themes/v2/image.php?postid=<?php echo $post->ID ?>" />
现在我的问题是:创建图像时没有帖子标题。我是否需要包括任何其他内容才能执行\\u标题?

2 个回复
最合适的回答,由SO网友:birgire 整理而成

一般来说,这里的问题是,在没有加载WordPress的PHP文件中调用WordPress函数。

在您的image.php 如果包含帖子ID,则文件可能有效

<img src="/wp-content/themes/v2/image.php?post_id=123" />
但是想象一下,如果您在一个页面上有100个图像,那么您将运行101个WordPress实例!

您可以尝试连接到WordPress并只运行WordPress的最小化版本,但我们仍然在为这些图像中的每一个运行PHP。

另一种方法是避免在image.php 仅归档并抓取标题文本:

<img src="/wp-content/themes/v2/image.php?title=Hello+World!" />
但这里的危险是,任何人都可以用任何文本创建图像。那可不好。您可以添加限制,例如检查推荐人,但这可能不是“无懈可击的”。

更好的方法可能是在修改文章标题时创建图像文件。然后,我们可以使用以下命令调用图像文件:

<img src="/wp-content/uploads/titles/image-123.png" />
但对于浏览器缓存之类的东西,我们可能需要一个缓存拦截器:

<img src="/wp-content/uploads/titles/image-123.png?last-modified=1445683693 " />
我们还可以在图像文件名中使用帖子标题:

<img src="/wp-content/uploads/titles/image-hello-world.png" />
这里唯一需要做的是,我们需要为旧帖子生成这些图片。

让我们仔细看看最后提到的方法。

实现

假设我们在服务器上安装了GD映像包。然后我们可以延长WP_Image_Editor_GD 根据我们的需要分类:

class WPSE_Image_Editor_GD extends WP_Image_Editor_GD
{
    private $wpse_bgclr;
    private $wpse_txtclr;
    private $wpse_txt;

    public function wpse_new( $width = 0, $height = 0 ) 
    {
        $this->image = imagecreate( $width, $height );
        return $this;
    }

    protected function wpse_color(  $red = 0, $green = 0, $blue = 0 )
    {
        return imagecolorallocate( $this->image, (int) $red, (int) $green, (int) $blue );
    }

    public function wpse_textcolor( $red = 0, $green = 0, $blue = 0 )
    {
        $this->wpse_txtclr = $this->wpse_color( (int) $red, (int) $green, (int) $blue );
        return $this;
    }

    public function wpse_bgcolor( $red = 0, $green = 0, $blue = 0 )
    {
        $this->wpse_bgclr = $this->wpse_color( (int) $red, (int) $green, (int) $blue );
        return $this;
    }

    public function wpse_text( $text ) 
    {           
        $this->wpse_txt = imagestring( $this->image, 5, 0, 0, $text, $this->wpse_txtclr );
        return $this;
    }

}
在这里,我们在方法前面加上前缀wpse_ 以避免将来可能发生的名称冲突。

还可以方便地返回$this 用于链接。

我们可以通过以下方式获取当前上载路径:

$upload_dir = wp_upload_dir();
并为生成的标题设置上载路径。png文件,我们可以使用:

$file = sprintf( \'%s/wpse_titles/image-%s.png\', 
    $upload_dir[\'basedir\'], 
    strtolower( sanitize_file_name( $post->post_title ) ) 
);          
这会将Hello World标题保存到文件中:

/wp-content/uploads/wpse_titles/image-hello-world.png
我们可以使用save_post_{$post_type} 钩子以特定的帖子类型更新为目标。

但不想在每次更新时生成它,所以让我们检查它是否是一个已存在的文件,其中包含:

if( is_file( $file ) )
    return;
现在,我们可以使用自定义类并创建一个实例:

$o = new WPSE_Image_Editor_GD;
并创建一个空图像对象,对其着色,向其中添加帖子标题字符串,然后保存:

    $result = $o
        ->wpse_new( 300, 60 )              // Width x height = 300 x 60
        ->wpse_bgcolor( 0, 0, 255 )        // Background color as Blue
        ->wpse_textcolor( 255, 255, 0 )    // Text color as Yellow
        ->wpse_text( $post->post_title )   // Hello World
        ->save( $file, \'image/png\' );      // Save it to image-helloworld.png
输出示例这里有一个示例,演示了如何使用helloworld图像。png图像如下所示:

hello world

演示插件

在这里,我们将其全部添加到一个演示插件中:

<?php
/**
 * Plugin Name:   WPSE Title Images
 * Description:   On post update, create a png file of the post title (/uploads/wpse-titles/)
 * Plugin Author: Birgir Erlendsson (birgire)
 * Plurin URI:    http://wordpress.stackexchange.com/a/206433/26350
 * Version:       0.0.2
 */
add_action( \'save_post_post\', function( $post_id, $post )
{
    // Ignore auto save or revisions
    if ( wp_is_post_revision( $post_id ) || wp_is_post_autosave( $post_id ) )
        return;

    if( class_exists( \'WPSE_Image_Editor_GD\' ) )
        return;

    // Get the current upload path      
    $upload_dir = wp_upload_dir();

    // Generated file path
    $file = sprintf( 
        \'%s/wpse_titles/image-%s.png\', 
        $upload_dir[\'basedir\'], 
        sanitize_key( $post->post_title ) 
    );          

    // Only create it once
    if( is_file( $file ) )
        return;

    // Load the WP_Image_Editor and WP_Image_Editor_GD classes 
    require_once ABSPATH . WPINC . \'/class-wp-image-editor.php\';
    require_once ABSPATH . WPINC . \'/class-wp-image-editor-gd.php\';

    // Our custom extension
    class WPSE_Image_Editor_GD extends WP_Image_Editor_GD
    {
        private $wpse_bgclr;
        private $wpse_txtclr;
        private $wpse_txt;

        public function wpse_new( $width = 0, $height = 0 ) 
        {
            $this->image = imagecreate( $width, $height );          
            return $this;
        }

        protected function wpse_color(  $red = 0, $green = 0, $blue = 0 )
        {
            return imagecolorallocate( $this->image, (int) $red, (int) $green, (int) $blue );
        }

        public function wpse_textcolor( $red = 0, $green = 0, $blue = 0 )
        {
            $this->wpse_txtclr = $this->wpse_color( (int) $red, (int) $green, (int) $blue );                
            return $this;
        }

        public function wpse_bgcolor( $red = 0, $green = 0, $blue = 0 )
        {
            $this->wpse_bgclr = $this->wpse_color( (int) $red, (int) $green, (int) $blue );             
            return $this;
        }

        public function wpse_text( $text ) 
        {           
            $this->wpse_txt = imagestring( $this->image, 5, 0, 0, $text, $this->wpse_txtclr );
            return $this;
        }

    } // end class

    // Generate and save the title as a .png file   
    $o = new WPSE_Image_Editor_GD;

    $result = $o
        ->wpse_new( 300, 60 )              // Width x height = 300 x 60
        ->wpse_bgcolor( 0, 0, 255 )        // Background color as Blue
        ->wpse_textcolor( 255, 255, 0 )    // Text color as Yellow
        ->wpse_text( $post->post_title )   // Hello World
        ->save( $file, \'image/png\' );      // Save it to image-helloworld.png

}, 10, 3 );
然后,我们可以创建自己的模板标记,以显示每篇文章的图像:

if( function_exists( \'wpse_title_image\' ) )
    wpse_title_image( $default_url = \'\' );
下面是一个示例,但在适当的插件结构中,我们应该能够删除此处显示的重复代码:

/**
 * Get the current post\'s title image 
 *
 * @param string $default_url Default image url
 * @return string $html Html for the title image
 */
function get_wpse_title_image( $default_url = \'\' )
{
    $post       = get_post();
    $upload_dir = wp_upload_dir();
    $dirname    = \'wpse_titles\';

    $file = sprintf( 
        \'image-%s.png\',
        strtolower( sanitize_file_name( $post->post_title ) ) 
    );

    $file_path = sprintf( 
        \'%s/%s/%s\',
        $upload_dir[\'basedir\'], 
        $dirname,
        $file
    );      

    $file_url = sprintf( 
        \'%s/%s/%s\',
        $upload_dir[\'baseurl\'], 
        $dirname,
        $file
    );          

    if( is_file( $file_path ) && is_readable( $file_path ) )
        $url = $file_url;
    else
        $url = $default_url;

    return sprintf( 
        \'<img src="%s" alt="%s">\', 
        esc_url( $url ),
        esc_attr( $post->post_title )
    );
}
然后可以定义以下包装:

/**
 * Display the current post\'s title image 
 *
 * @uses get_wpse_title_image()
 *
 * @param string $default_url Default image url
 * @return void
 */
function wpse_title_image( $default_url = \'\' )
{
    echo get_wpse_title_image( $default_url );
}
注释:此演示可以进一步扩展,如:

将其纳入适当的插件结构,调整每个标题图像的宽度和高度的处理

  • 为所有帖子自动生成图像
  • 对其他帖子类型执行此操作
  • 。。。等等
  • SO网友:Arif

    我以形象思考。php,post Id为空,因此无法获取任何内容。此外,这是图像中唯一的代码吗。php?在调用get\\u the\\u title&;之前,您需要确保WordPress系统已加载;将postid从调用者传递到图像。类似php的图片。php?pid=223

    在图像顶部加载Wordpress。php文件:

    require(\'./wp-load.php\');
    
    从URL参数获取postid:

    $postID = $_GET[\'pid\'];
    
    然后剩下的代码按原样运行。

    在image tags src中调用此脚本时,请确保传递正确的pid

    src="image.php?pid=xxx"
    

    相关推荐

    Convert emoji to images

    我有一个私有插件,可以导出所有没有“主题化”的帖子,所以输出的只是内容的html(帖子主题为H1,日期/时间为H2)。如果帖子包含表情符号,它会正确显示在主题页面上。但是如果我将HTML输出保存到一个文件中,表情符号会显示为&eth;&#159;&#153;&#129; 这些是UniCode字符(我想),我需要生成的HTML页面将表情符号显示为图形图像。创建HTML输出的代码使用标准WP\\u查询对象,然后在have\\u posts循环中输出内容:$thest