去角标、去弹窗提醒、调整角标大小等小程序图片问题,一文说清!

原创 收藏 评论
举报 2022-06-30

排版一旦「较真」起来,小小的图片角标也会发现很多问题。

在公众号图文中,有两种情况图片会带角标,一个是超链接图片,一个是小程序图片

上面是在公众号后台直接插入的超链接和小程序图片,面对这两种简单的形式,一些小伙伴却发现了不少问题。

当然,这里的问题不是说官方对这两种形式的展现有问题,而是当把它们放到长图排版的情境中时,发现改变一些东西可能会与整体更搭。

下面5个问题是经常会有小伙伴提出来的,不说不知道,说了一看还真是有道理。老沙也给大家提供了对应的解决方法。

1不想要角标

一些对审美有一定追求的品牌,比如汽车、奢侈品品牌,总会有这个想法。

这些品牌的长图排版中每一张切图都是经过精心设计,图片右上角突然出现的角标常常会显得格格不入,严重影响了图片的美观,这时候不把碍眼的角标去掉真是说不过去。

在 iPaiban Pro 黑科技编辑器中,使用对应组件就可以制作出无角标的超链接和小程序图片:

无角标1.png

组件:超链接-图片(无角标)

编号:10033(组件)

跳转5.png

组件:小程序-图片(无角标)

编号:10015(组件)

点击体验一下,你会发现超链接图片除了没角标,还没有了弹窗确认提醒,点击一下就跳转出去了,非常利于转化。

2想保留角标但不想要弹窗确认提醒

角标可不是一无是处,一张图片带了角标,这就代表这张图片是可以点击跳转的。

即便你在图片上设计了引导点击的提示,而右上角独特的符号因为已经为大多数用户所熟悉,往往会有更强的引导提示作用。

所以超链接图片如果你想保留角标去掉弹窗确认提醒的话,可使用下方组件:

跳转3.png

组件:超链接-图片(默认角标)

编号:10034(组件)

不过因微信平台限制,小程序图片暂时不能去掉弹窗确认提醒了,如果你的目的只是想让用户一步触达,那么可以使用小程序原生卡片的相关组件,在图文中原生卡片一直是没有弹窗确认提醒的。

3宫格内角标变小想变大一些

图文的签名区,一行常常需要摆放多个超链接或小程序图片,如果使用默认角标的组件,你会发现角标跟着变小了。

跳转4.png


组件:超链接-图片(自定义角标位置)

编号:10035(组件)

组件:小程序-图片(自定义角标位置)

编号:10031(组件)

使用上面两个组件,双击图片即可任意调整角标的位置和大小。



4觉得原生角标不搭,想换新角标

觉得原生角标不搭,想换新角标的方法有两种:

一种直接将新角标设计在图片上,使用无角标相关组件;

一种是使用可以自上传角标的组件

组件:超链接-图片(自上传角标,自定义位置)

编号:10036(组件)

组件:小程序-图片(自上传角标,自定义位置)

编号:10032(组件)

使用这两个组件,我们可以上传自己设计的角标,并且支持自定义位置大小。

5如何设置点击特定区域触发

这里就要推荐下面两个组件了:

组件:超链接-图片(设置多个链接区)

编号:11134(组件)

组件:小程序-图片(设置多个小程序)

编号:11135(组件)

教程:《1张图片上添加多个超链接/小程序/弹出图,怎么弄?》

看名字就能明白,这两个组件分别支持在一张图片上设置多个超链接或小程序,触发区在不重叠的情况下可以任意摆放。

在之前教程中没有讲过的是,其实一张图片上设置一个超链接或小程序的时候也可以用,与只支持设置一个的组件相比,它是可以调整这一个超链接或小程序的触发区的,非常方便。相信这篇文章能把大家关于超链接、小程序的角标问题基本解决了,如果还有问题,留言区等你!

制作SVG交互图文认准 iPaiban Pro 黑科技编辑器,网址:x.iPaiban.com,复制网址在 PC 端 Chrome(谷歌)浏览器打开,即可开始注册并使用。

新用户在「新手礼包」可领取3天企业标准版会员体验权,以及22个常用必备组件的大礼包(1年)




● SVG 黑科技交互排版????????

·

本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本内容为作者独立观点,不代表数英立场。
本文禁止转载,侵权必究。
本文系数英原创,未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)