wordpress二十一社交媒体分享图标,无需插件建议。

时间:2017-10-24 16:59:17

标签: wordpress svg wordpress-theming custom-wordpress-pages social-media

我很好奇这是否是将社交媒体SVG图标添加到页面和帖子类型(不使用插件)的最佳做法?

我已向WordPress页面添加了三个自定义字段并发布。 facebook,twitter和google plus字段我已经添加了WordPress提供的特定于每个社交媒体网站的SVG标记。 wordpress page admin screenshot

这是我添加到首页的代码,我需要添加社交分享图标

<header class="entry-header-hp">
                    <div class="page-title-homepage">
                    <?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
                    <nav class="social-naviation-news" role="navigation">
                        <div>
                            <ul>
                                <li>
                                    <a href="http://www.facebook.com/sharer/sharer.php?s=100&p[url]=<?php echo urlencode(get_permalink()); ?>" target="_blank"><?php echo the_field('facebook'); ?>
                                     </a>
                                </li>
                                <li>
                                    <a href="https://twitter.com/intent/tweet?text=<?php echo urlencode(get_the_title()); ?>+<?php echo get_permalink(); ?>" target="_blank">
                                   <?php echo the_field('twitter'); ?>
                                    </a>
                                </li>
                                <li>
                                   <a href="https://plus.google.com/share?url=<?php echo urlencode(get_permalink()); ?>" target="_blank">
                                   <?php echo the_field('Google'); ?>
                                    </a>
                               </li>
                            </ul>
                        </div>
                     </nav>
                    </div>
                    <div class="entry-meta">
                        <?php echo the_modified_date(); ?>
                    </div><!-- .entry-meta -->
                    <div class="edit-link">
                    <?php twentyseventeen_edit_link( get_the_ID() ); ?>
                    </div>
                </header><!-- .entry-header -->

如您所见,图标将显示在首页上。 HTTPS // staging.rockimages.com

这是一个好方法还是会导致任何问题?

1 个答案:

答案 0 :(得分:0)

这不会导致问题,但我建议您以可重复使用的方式构建共享元素,并且不需要对多个页面模板进行批量更改。所以基本上从中创建一个函数并将其放在主题的functions.php文件中。此外,如果您使用任何默认的Wordpress主题,请确保复制原始并重命名或创建子主题。

<强>价:

  

https://premium.wpmudev.org/blog/five-hacks-twenty-seventeen/#social   https://premium.wpmudev.org/blog/how-to-create-wordpress-child-theme/