- This topic has 9 replies, 3 voices, and was last updated 3 years, 12 months ago by David.
-
AuthorPosts
-
April 25, 2020 at 2:55 am #1254700Carsten
Hi there, I would like to add different graphic elements or flavicons to different pages by using display rules.
There are different methods, as I understand:
One method is to use HTML icons:
Use HTML to insert icons as an individual image.
<i class="icon-home" style="color: #FF5D5D"></i>
<a href="http://mysite.com"><i class="icon-home"></i></a>
Another to use flavicon with something like this.
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
Last option is to add a png.
All three methods need to be wrapped into php to use in a hook element.
I really would like to learn more about that, to get more control over my site content by using elements, which opens up a lot of new options. Any documentation on marking up content for elements?Creating an element for each page to put different graphic elements leads to many elements. How does elements affect load time and performance on a site, generelly?
Regards
CarstenApril 25, 2020 at 9:32 am #1255269TomLead DeveloperLead DeveloperHi there,
Why would these elements need to be wrapped in PHP? What would the PHP be doing?
The Display Rules determine whether to execute the Element or not. If you adding hundreds of Elements, you might notice it performance-wise somewhat, depending on your server. However, if you’re only adding a handful of them, it will make no difference.
April 25, 2020 at 10:10 am #1255312CarstenHi there, my php skills are next to nothing,so since the element is executing php, I expected them to be wrapped to work 😉
April 25, 2020 at 5:22 pm #1255722TomLead DeveloperLead DeveloperYou shouldn’t need to add PHP at all in the Hook content unless you’re doing something very advanced.
April 26, 2020 at 3:45 pm #1256959CarstenHi there, I would like to add individual png’s to individual hooks on pages, can I ask for your help, how this markup would look like, to insert in a hook element?
Thanks
April 27, 2020 at 5:15 am #1257603DavidStaffCustomer SupportHi there,
you just need to use an
<img />
HTML tag – you may find this useful:April 27, 2020 at 6:00 am #1257664CarstenHi David, thanks for the link to 3schools,its working fine with the example.
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
But I need to insert an image from my media directory, this would have been easy, but it is of course not working.
<img src="https://domain/wp-content/uploads/2020/03/cropped-thumbs-up-e1587833175378-1.png">
I guess I need to add href= for it to work, but how would the markup look for this?
April 27, 2020 at 6:24 am #1257698DavidStaffCustomer SupportNope that markup you have is correct – check the URL to your image in a browser tab to make sure it is correct.
April 27, 2020 at 6:38 am #1257724CarstenYes, it’s working now, great!
Thank you!
April 27, 2020 at 6:50 am #1257746DavidStaffCustomer SupportGlad we could be of help
-
AuthorPosts
- You must be logged in to reply to this topic.