iryna

Hi there! My name is Iryna, I am a web developer from Ukraine. While working on freelance projects I often face different technical issues and in this blog I publish articles on how to solve them. I am also interested in digital drawing and in this blog you will find brief tutorials that helped me and hopefully can help you as well.

Show and hide block with js

March 19, 2020 HTML, CSS, JS, Useful solutions 0

Few examples for showing a block on button click. Example 1: easy to use <script type="text/javascript"> function openlink(id){ display = document.getElementById(id).style.display; if(display=='none'){ document.getElementById(id).style.display='block'; }else{ document.getElementById(id).style.display='none'; } } </script> The block will be opened by clicking on the link: <a href="#" onclick="openlink('mylink'); return false">Open the link</a> Content will be shown when …

Fa fa icon not showing

March 19, 2020 HTML, CSS 0

If your icons, for example <i class=”fa fa-arrow-right”></i> are not displayed on your site, you need to try in the <head> section add this line: <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" media="screen" /> Important! Be sure to use https instead of http. If it doesn’t solve the problem, then add this property to …

Contact form in a pop-up window

March 16, 2020 Wordpress 0

One of the most popular forms for WordPress is Contact Form 7, but in the settings there is no way to call the form through a click. You can download the Easy Fancybox plugin, go to Settings – Media and in the Enable FancyBox for block, uncheck Images, and check …

Zooming in and out of an image/button/link when hovering over an element

March 13, 2020 HTML, CSS 0

You need to use the transform property and set it to scale(1.1) to increase it and scale(0.9) to decrease it. When hovering over an image/button/link with the class button, it will increase by 10% or decrease by 10%. Increase image/button/link – CSS: .button:hover { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); …

Contact form 7 with spoilers/accordion

March 12, 2020 Useful solutions, Wordpress 0

I needed to publish a questionnaire, with answer options opening by clicking on a question. There were no ready-made plugins for implementation, so I made a code for use: Contact Form 7 with accordion Full form template (sorry for the RU answer options): <div class="tabs"> <div class="tab"><input type="radio" id="rd1" name="rd"><label …

Include the file and display the value if it is specified in this file

March 11, 2020 Bitrix, Joomla, PHP, SEO optimization, Wordpress 0

This method was created for SEO edits on the Bitrix site (generated h1 values were entered in the file and displayed in the template). Today I returned to this solution for canonical edits, here is the code and description: <?php include($_SERVER['DOCUMENT_ROOT']."/seo.php"); if(isset($seoh1) AND $seoh1!='') {echo $seoh1;} else {echo $heading_title;} ?> …

How to display gc_breadcrumbs in WordPress theme

March 10, 2020 Wordpress 0

If the site uses a theme not with default breadcrumbs, but with gc_breadcrumbs, and you use custom post types, then there may be a problem when breadcrumbs are not displayed on the site. Here is the code that allows you to display the plugin anywhere in the site template: <?php …

How to add a new menu area in wordpress

March 10, 2020 Wordpress 0

In the process of customizing templates, it is often necessary to add and display a new WordPress menu. To do this, you need to paste the following code into functions.php: function wpb_custom_new_menu() { register_nav_menu('my-custom-menu',__( 'My Custom Menu' )); } add_action( 'init', 'wpb_custom_new_menu' ); If you need to add multiple areas …

Error Not Acceptable An appropriate representation of the requested resource could not be found on this server.

March 8, 2020 Hosting, domain names, Wordpress 0

After transferring the site to another host and trying to save changes in the admin panel, for example, such a code: <p class="block"> <svg xmlns="http://www.w3.org/2000/svg" width="700" height="72" viewBox="0 0 700 72"> <text x="0" y="70">Stroked text</text> </svg> </p> I get an error: Not Acceptable An appropriate representation of the requested resource …

Text with border/border around text in css

March 8, 2020 HTML, CSS 0

This article describes two options for decorating text with a border around the text along the path of the same text. There are, of course, more of these options. But I usually use the ones listed below. Example 1, crappy: using the text-shadow property text-shadow: 1px 0 0 red, -1px …

Page 11 of 16« First...«9 101112 13 » ...Last »