如何做wordpress滚动公告(WordPress滚动公告)

1.添加公告文章类型。

首先，注册公告的文章类型，包括公告的创建、添加、编辑和删除。使用以下代码在functions.php的同级目录中创建一个新的gonggao.php:

& lt？PHP function post _ type _ bulletin(){ register _ post _ type(& # 039；公告& # 039；，数组(& # 039；public & # 039= & gt真的，& # 039；可公开查询& # 039；= & gt真的，& # 039；等级& # 039；= & gt假的，& # 039；标签& # 039；= & gt数组(& # 039；姓名& # 039；= & gt_ x(& # 039；公告& # 039；, '岗位类型通用名称& # 039；), 'singular _ name & # 039= & gt_ x(& # 039；公告& # 039；, '帖子类型单数名称& # 039；), 'add _ new & # 039= & gt_ x(& # 039；添加新公告& # 039；, '公告& # 039；), '添加新项目& # 039；= & gt__('添加新公告& # 039；), 'edit _ item & # 039= & gt__('编辑简报& # 039；), 'new _ item & # 039= & gt__('新的公告& # 039；), 'view _ item & # 039= & gt__('预览& # 039；), '搜索_项目& # 039；= & gt__('搜索& # 039；), 'not _ found & # 039= & gt__('您还没有发布公告& # 039；), 'not _ found _ in _ trash & # 039= & gt__('回收站中没有公告& # 039；), 'parent _ item _ colon & # 039= & gt''), 'show _ ui & # 039= & gt真的，& # 039；菜单_位置& # 039；= & gt5, '支持& # 039；= & gt数组(& # 039；标题& # 039；, '作者& # 039；, '摘录& # 039；, '缩略图& # 039；, '引用通告& # 039；, '编辑& # 039；, '评论& # 039；, '自定义-字段& # 039；, '修订& # 039；) , 'show _ in _ nav _ menus & # 039= & gt真的，& # 039；menu _ icon & # 039= & gt'dashi con S-扩音器& # 039；, '分类法& # 039；= & gt数组(& # 039；菜单类型& # 039；, 'post _ tag & # 039) ) );} add _ action(& # 039；init & # 039, '邮政类型公告& # 039；);函数create _ genre _ taxonomy(){ $ labels = array(& # 039；姓名& # 039；= & gt_ x(& # 039；公告的分类& # 039；, '分类法通用名& # 039；), 'singular _ name & # 039= & gt_ x(& # 039；流派& # 039；, '分类学单数名称& # 039；), '搜索_项目& # 039；= & gt__( '搜索& # 039；), 'all _ items & # 039= & gt__( '所有类别& # 039；), 'parent _ item & # 039= & gt__( '父类别& # 039；), 'parent _ item _ colon & # 039= & gt__( '父类别:& # 039；), 'edit _ item & # 039= & gt__( '编辑公告分类& # 039；), '更新_项目& # 039；= & gt__( '更新& # 039；), '添加新项目& # 039；= & gt__( '添加新的公告类别& # 039；), 'new _ item _ name & # 039= & gt__( '新流派名称& # 039；), );register _ taxonomy(& # 039；流派& # 039；，数组(& # 039；公告& # 039；)，数组(& # 039；等级& # 039；= & gt真的，& # 039；标签& # 039；= & gt$labels，& # 039；show _ ui & # 039= & gt真的，& # 039；query _ var & # 039= & gt真的，& # 039；重写& # 039；= & gt数组(& # 039；slug & # 039= & gt'流派& # 039；), ));} add _ action(& # 039；init & # 039, 'create _ genre _分类学& # 039；, 0 );引用functions.php发布的gonggao.php文档，并在functions . PHP的底部添加以下代码:

包括(& quotgonggao.php & quot);之后登录wordpress网站后台，可以看到文章底部有一个公告标签。在上面的代码中

'menu _ icon & # 039= & gt'dashi con S-扩音器& # 039；，也就是我们设定的大栅栏。效果如下图。如果删除此行，图标将默认与文章的图标相同。

2.添加公告样式

将以下公告内容代码放在index.php想要显示的位置:

& ltdiv id = & quot站点-高拱& quot& gt& ltdiv class = & quotsite -gong Gao -div & quot；& gt& lt我认为。fa fa-volume -up & quot；& gt& lt/I & gt；& lt/div & gt；& ltdiv id = & quotsite -宫高-div 2 & quot；class = & quotsitediv & quot& gt& ltul class = & quot列表& quotid = & quotsiteul & quot& gt& lt？PHP $ loop = new WP _ Query(array(& # 039；post _ type & # 039= & gt'公告& # 039；, 'posts _ per _ page & # 039= & gt3 ) );while(＄loop ->；have _ posts()):$ loop -& gt；_ post()；？& gt& lt李& gt& lt？php mb_strimwidth(the_content()，0，70，& # 039；…');？& gt& lt/李& gt& lt？php endwhileWP _ reset _ query()；？& gt& lt/ul & gt；& lt/div & gt；& lt/div & gt；3表示有3个公告，70表示每个公告显示70个字符。这个可以根据自己的情况来设置。

3.添加css代码

将以下代码复制到main.css文件中:

div # site -高拱{ line -height:25px；高度:30pxbackground -color:# FFF；padding -left:10px；颜色:# 666；-WebKit -box -shadow:0 5px 5px # d3d 3d 3；box -shadow:0 5px 5px # d3d 3d 3；} # site -高拱。list { padding -left:5px；} . site -宫高-div { float:left；} .fa-volume-up:在{ content:& quot；\ \ f028 & quot；颜色:# 428bca} # site -高拱a { color:# 1663 B7；} # site -高拱a:hover { color:# 09F；} #site-gonggao-div2 {溢出:隐藏；高度:30px} # site -宫高-div2。列表李{身高:30pxline -高度:30px溢出:隐藏；} # site -宫高-div2。list Li p { display:inline；溢出:隐藏；white -space:nowrap；text -溢出:省略号；}4.添加滚动公告js代码

要添加公告的滚动代码，需要jQuery库。当然，DUX主题已经加载完毕。只要把下面的代码复制到header.php。

函数auto scroll(obj){ var aa = document . getelementbyid(& quot；siteul & quot).getElementsByTagName(& quot；李说:).长度；如果(aa！==1){ jQuery(obj)。查找(& quot。列表& quot).动画({ margin top:& quot；-30px & quot；}，500，function(){ jQuery(this)。CSS({ margin top:& quot；0px & quot}).查找(& quot李:首先& quot).附录(this)；}) };} $(function(){ setInterval(& # 039；自动滚动(& quot。sitediv & quot)',4000) }) ;其中，“。第4行的“list”是调用代码中ul标签的类样式；的”。第12行中的“sitediv”是包装ul的div标记的类样式。

更多与wordpress相关的技术文章，请访问wordpress教程专栏进行学习！