Add Icon in exceprt field - Support | Kriesi.at

Tagged: error, icon, shortcode

Viewing 27 posts - 1 through 27 (of 27 total)

Author

Posts
February 2, 2016 at 7:43 am #576273

michael_world2cycle
Participant

Dear all,
I am using the advanced lay out builder and would like to add a Icon in the exceprt.
To achieve this I have copy, paste the following code;

[av_font_icon icon='ue8c7' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color=''][/av_font_icon]

But is doesn’t seem to work.
Can you please explain why this short code is not working properly?
Thanks :-)

February 2, 2016 at 7:48 am #576277
Basilis
Inactive Moderator
Hi michael_world2cycle!

Please add the following to your functions.php file and let us know if it works
```
add_filter( 'the_excerpt', 'shortcode_unautop');
add_filter( 'the_excerpt', 'do_shortcode');
```
Regards,
Basilis
February 2, 2016 at 9:01 am #576315

michael_world2cycle
Participant

Thanks Basilis,
Via Appearance I selected ‘theme functions (functions.php)” scroll down and copy, paste the coding.

add_filter( ‘the_excerpt’, ‘shortcode_unautop’);
add_filter( ‘the_excerpt’, ‘do_shortcode’);

Next I went to my post to check if it works.
http://world2cycle.com/wp-admin/post.php?post=125&action=edit

In de default editor I generate the short code and used this in the advanced lay out builder in the excerpt.
But I doesn’t seem to work.

Did I missed a step?

February 2, 2016 at 10:51 pm #576759

michael_world2cycle
Participant

Hi,
Currently it seems that my whole website went down.
I have contacted my webhosting and the following error message have been shared.

[Tue Feb 2 21:41:19 2016] [error] PHP Parse error: syntax error, unexpected end of file in /var/www/vhosts/55/234961…nt/themes/enfold/functions.php on line 522

They mentioned to remove my theme for the FTP and install it again.
Does this mean that I will loose all of my posts, pages, settings etc….

When you have another suggestion please let me know as this is quite an issue.

February 4, 2016 at 4:26 am #577526

Ismael
Moderator

Hey!

Get a fresh copy of the functions.php file then override the old one. Where did you copy the shortcode? Placing it inside the excerpt field should work. If you can’t find the excerpt field, go to the screen option then enable it.

Cheers!
Ismael

February 4, 2016 at 7:40 am #577608

michael_world2cycle
Participant

Hi Ismael,
As mentioned I did the following.
Via Appearance I selected ‘theme functions (functions.php)” scroll down and copy, paste the coding.

add_filter( ‘the_excerpt’, ‘shortcode_unautop’);
add_filter( ‘the_excerpt’, ‘do_shortcode’);

Just for me to clarify.
Did I need to post this coding in full in the exceprt field, as did was not what was mentioned previously.

And how do I need to combine this with the following coding (which is the shortcode for the Icon I would like to use)

[av_font_icon icon='ue8c7' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color=''][/av_font_icon]

February 5, 2016 at 4:52 am #578219

Ismael
Moderator

Hey!

Place the previous code in the functions.php file then put the shortcode in the excerpt field. I tried to to login to the site but there’s an internal server error. Please contact your hosting provider.

Regards,
Ismael

February 8, 2016 at 9:46 pm #579912

michael_world2cycle
Participant

Hey Ismael,
Can you maybe now check if you are able to login.
The last time I tried to add the coding I had to reinstall the theme.
Looking forward to your findings :-)

February 9, 2016 at 7:39 am #580161

michael_world2cycle
Participant

I just want to mention that I have add a child theme.

February 10, 2016 at 7:17 am #580843

Ismael
Moderator

Hey!

We created a test post with the icon shortcode inside the excerpt field: http://world2cycle.com/wp-admin/post.php?post=625&action=edit

You can see the excerpt on this page: http://world2cycle.com/test-page/

Best regards,
Ismael

February 24, 2016 at 9:29 am #588247

michael_world2cycle
Participant

Thanks for the support Ismael.
I am using the advanced lat out builder.
What I did was copying the coding as stated below and paste this in the post

http://world2cycle.com/wp-admin/post.php?post=125&action=edit

Can you explain why the this coding is not working for this post?
[av_font_icon icon='ue800' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color=''][/av_font_icon]

February 26, 2016 at 7:32 am #589575

Ismael
Moderator

Hey!

I included that post in the test page and the icon is showing up: http://world2cycle.com/test-page/

Best regards,
Ismael

February 26, 2016 at 7:42 am #589578

michael_world2cycle
Participant

Thanks Ismael.
I do know that you have created a test page.
But when taking the same steps as you did it doesn’t seem to work for my posts.

Therefore can you please share your comments on what I explained in my previous post,
or preferable as an example please use the post.

http://world2cycle.com/wp-admin/post.php?post=239&action=edit

I am curious if you are able to get a working icon in the exceprt field.
For your information I am using the Advanced Layout Builder.

March 3, 2016 at 11:24 am #592558

Ismael
Moderator

Hey!

Where is your blog overview page or the page where you intend to display the posts? I need that more than the post example.

Cheers!
Ismael

March 3, 2016 at 4:09 pm #592677

michael_world2cycle
Participant

Thanks Ismael for taking the time to have a look.
I am using the post slider to have various posts being shown on serval pages.
For example at the end of the post of Paris Roubaix
I end the post with;
You may also be interested in;
And on that position I want to share via the post slider several posts that can linked to the subject of the post.
http://world2cycle.com/wp-admin/post.php?post=125&action=edit

Also on the frontpage I am using post sliders.
http://world2cycle.com/
Check underneath the subject line populair.

And I was hoping that the icon will also been shown on the archive page.
For example see the following page.
http://world2cycle.com/cyclingevents/france/

All of the link given include the post 125 (Paris Roubaix) to make is easier to see if it all works.

Looking forward to your response.

March 9, 2016 at 11:01 am #595455
Ismael
Moderator
Hey!

Alright. Thank you for the update. Now, I get it. The issue with this is that the grid style or the post slider do not accept shortcode. Try to add the actual html markup of the icon instead of the shortcode. Example:
```
<a href="LINK HERE" class="av-icon-char" style="font-size:20px;line-height:20px;" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></a>
```
The code above will add the “notes’ icon. Are you going to use different icons?

Regards,
Ismael
March 9, 2016 at 11:01 pm #595882

michael_world2cycle
Participant

Okay, I understand. But you mentioned to use the actual html markup. How can I do that, because indeed I would like to have more icons being displayed in the post slider. For example the icon which has the following shortcode.

[av_font_icon icon='ue8c7' font='entypo-fontello' style='border' caption='' link='' linktarget='' size='20px' position='left' color=''][/av_font_icon]

Thanks!

March 10, 2016 at 10:02 am #596184

Ismael
Moderator

Hey!

You will have to extract the html markup in the browser’s element inspector (more info here). Please create a temporary page with all the icons that you’re going to use then we’ll extract the html codes.

Regards,
Ismael

March 10, 2016 at 3:33 pm #596314

michael_world2cycle
Participant

Thanks Ismael,
I have a temporary page.
The permalink is http://world2cycle.com/test-page/

March 14, 2016 at 7:48 am #597586
Ismael
Moderator
Hey!

These are the html markups for the icons:

Mail:
```

```
Check:
```

```
Info:
```

```
Home:
```

```
Eye:
```

```
Camera:
```

```
Notepad:
```

```
Graph:
```

```
Speedometer:
```

```
Marker:
```

```
Street Sign:
```

```
Globe:
```

```
Magnifying Glass:
```

```
Cheers!
Ismael
March 15, 2016 at 11:00 pm #598668

michael_world2cycle
Participant

Great Ismael, thanks for the provide support! Very happy with this

March 16, 2016 at 11:58 pm #599301

michael_world2cycle
Participant

I have just one more question, because I believe this should be possible.
In the excerpt field I am using the html markup.
But now I want to achieve the following
(Icon1) Text1
(Icon2) Text2
(Icon3) Text3

Currently the following is happening.
(Icon1) (Icon2) (Icon3) Text1 Text2 Text3

March 17, 2016 at 2:41 am #599351
Ismael
Moderator
Hey!

Use the html list tag: http://www.w3schools.com/html/html_lists.asp
```
<ul style="list-style-type:none">
 <li>(icon) text</li>
 <li>(icon) text</li>
 <li>(icon) text</li>
</ul>
```
Best regards,
Ismael
March 19, 2016 at 2:18 pm #600700

michael_world2cycle
Participant

Thanks for the support.
I do have some more Icons I would like to use.
Can you provide support for the html markups for these icons

I have a temporary page.
The permalink is http://world2cycle.com/test-page/

March 21, 2016 at 3:33 am #600949
Ismael
Moderator
Hi!

No problem. Please use the following:

Camera:
```

```
Checkbox:
```

```
Calendar:
```

```
Bicycle:
```

```
Clock:
```

```
Euro:
```

```
Dollar:
```

```
Best regards,
Ismael
March 31, 2016 at 1:03 am #605576

michael_world2cycle
Participant

Ismael,
One more time I need you assistance.
Can you please provide the HTML mark up for the following;
Hereby the sort coding;
[av_font_icon icon='ue8cf' font='entypo-fontello' style='' caption='' link='' linktarget='' size='10px' position='left' color='' custom_class=''][/av_font_icon]

I have created a tempory page.
Hereby the permalink;
Front end
http://world2cycle.com/test-page/

Back end
http://world2cycle.com/wp-admin/post.php?post=627&action=edit

March 31, 2016 at 4:47 am #605614
Ismael
Moderator
Hey!

No problem. This is the html markup:
```

```
Cheers!
Ismael
Author

Posts

Viewing 27 posts - 1 through 27 (of 27 total)

You must be logged in to reply to this topic.