{"id":1423,"date":"2017-08-25T13:08:15","date_gmt":"2017-08-25T13:08:15","guid":{"rendered":"https:\/\/puvox.software\/?p=1423"},"modified":"2021-11-14T13:45:49","modified_gmt":"2021-11-14T13:45:49","slug":"the-only-correct-method-to-modify-csshtml-etc-of-wordpress-website","status":"publish","type":"post","link":"https:\/\/puvox.software\/blog\/the-only-correct-method-to-modify-csshtml-etc-of-wordpress-website\/","title":{"rendered":"CORRECT METHOD(!) to modify CSS\/HTML\/PHP of a WordPress website"},"content":{"rendered":"<div class=\"default-content-clss content_1423 type_post \"><div class=\"wpLinkHere\">Remember short-link to MUST-HAVE WP plugins: <a href=\"https:\/\/puvox.software\/wordpress\">puvox.software\/wordpress<\/a>&nbsp; <\/div><div style=\"clear:both;\"><\/div><h1 style=\"text-align: center;\">How to modify any existing <span style=\"text-decoration: underline;\"><a href=\"http:\/\/wordpress.org\">WordPress<\/a><\/span> site CORRECTLY!<\/h1>\n<h1><img fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-1425 size-full\" src=\"https:\/\/puvox.software\/wp-content\/uploads\/2017\/08\/wp-modification.png\" alt=\"re-code wp theme \" width=\"706\" height=\"343\" srcset=\"https:\/\/puvox.software\/blog\/wp-content\/uploads\/sites\/2\/2017\/08\/wp-modification.png 706w, https:\/\/puvox.software\/blog\/wp-content\/uploads\/sites\/2\/2017\/08\/wp-modification-400x194.png 400w, https:\/\/puvox.software\/blog\/wp-content\/uploads\/sites\/2\/2017\/08\/wp-modification-300x146.png 300w, https:\/\/puvox.software\/blog\/wp-content\/uploads\/sites\/2\/2017\/08\/wp-modification-520x253.png 520w, https:\/\/puvox.software\/blog\/wp-content\/uploads\/sites\/2\/2017\/08\/wp-modification-60x29.png 60w\" sizes=\"(max-width: 706px) 100vw, 706px\" \/><\/h1>\n<p>Almost in 99% cases I&#8217;ve met, WordPress website holders, who want to modify their chosen theme\/template or plugin functionality, they (or their programmers) do that in following way:<\/p>\n<ul>\n<li>Modify and hardcode the original theme files, inject their codes and creating some extra files in that theme directory<\/li>\n<li>In their personal notes (or somewhere in the damn), they save the list of modification &#8211; which files they have modified and what they did and etc.<\/li>\n<li>The most horrible glitch is, that very very soon, you will see the WordPress notes, that your Theme\/WordPress\/Plugins has a new release and you should upgrade. However, the hysterical WARNING comes into your mind &#8211; no, you MUST NOT do that, because all your theme modifications will be spoiled and your site will mess-up&#8230; EXCELLENT, right?<\/li>\n<li>The next horrible thing what a &#8220;developer&#8221; might do, is that he DISABLES (OUH!!) wordpress notifications, that tells you about updates&#8230;<\/li>\n<li>Well, if the above steps are familiar with you &#8211; then it&#8217;s time to think and tell yourself- that it&#8217;s time to change your &#8220;skills&#8221; &#8211; or stay forever as an unprofessional and low-level tech-guy. \u00a0Because if you dont want to learn new ways and instead, if you allow your site to implement this suicide, then you are a prey of a hacker very,very soon! Sit and wait &#8211; it will quickly appear when several new updates come, and you will have no idea about updates, instead, guarding in your OLD CASTLE (which appears to have many holes).<\/li>\n<\/ul>\n<h1 style=\"text-align: center;\">Standard way to modify the theme<\/h1>\n<p><strong>Method A:<\/strong><\/p>\n<p>The only case if your theme is developed by non-professionals, and it doesn&#8217;t support hooks (if you don&#8217;t know what is a hook, then please, clarify that. I.E., <a href=\"http:\/\/www.wpbeginner.com\/glossary\/hooks\/\">read this<\/a>), then yes, the only way could be to modify that original files, but at least, you should rename the theme folder to <strong>theme-name_modified<\/strong> (or even, something random name,like <strong>buristaxto<\/strong>\u00a0) and also rename that in theme&#8217;s <strong>style.css<\/strong> heading! Now, you can modify your original files, but note, that isn&#8217;t a brilliant way either.<\/p>\n<p><strong>Method B:<\/strong><\/p>\n<p>The only acceptable (at least, for me) way to modify WP website functionalities and styles, is to create your personal-custom library plugin, which you can modify anytime freely. It&#8217;s quite simple, follow the steps to create your blank plugin-file:<\/p>\n<ul>\n<li>At first, on your desktop, create a folder, i.e. &#8220;<strong>my-custom-plugin<\/strong>&#8221; and inside that, create <strong>index.php<\/strong> (or you can just copy that from another plugin).<\/li>\n<li>Put this lines in the clean index.php:\n<pre>&lt;?php\r\n\/**\r\n * Plugin Name: my-custom-plugin\r\n * Description: My Special Custom Plugin\r\n * Version: 1.1\r\n *\/ \r\nadd_action( 'wp_enqueue_scripts', 'add_my_scripts' );\r\nfunction add_my_scripts() {\r\n    wp_enqueue_style( 'my-custom-style', plugin_dir_url( __FILE__ ) . '\/<span style=\"color: #ff0000;\"><strong>mystyle.css<\/strong><\/span>', array(), '1.1', 'all');\r\n}\r\n\r\n\/\/add_action( 'wp_footer', 'my_footer_message' );\r\nfunction my_footer_message() {\r\n    echo \"Hi, i am a custom plugin\";\r\n    ?&gt;  &lt;script&gt; alert(\"I am a custom JS code\"); &lt;\/script&gt; &lt;?php\r\n}<\/pre>\n<\/li>\n<li>Now, in the same folder, create <span style=\"color: #ff0000;\"><strong>mystyle.css<\/strong><span style=\"color: #000000;\">\u00a0 and put your all custom styles there (no need any headers there, start CSS codes from first line at all)<\/span><\/span><\/li>\n<\/ul>\n<p>Now, it&#8217;s ready! \u00a0 Upload your &#8220;<strong>my-custom-plugin<\/strong>&#8221; folder into your plugins and activate it. THAT&#8217;S ALL! \u00a0From now, you wont fear of WordPress, plugin or theme updates \u00a0(unless something major change happens, and even that change shouldn&#8217;t be a pain).<\/p>\n<p>However, as a last advice, I have to admit, that if your theme is satisfying for you, and you don&#8217;t need any updates, then you should rename it (like described above) and leave it un-updated, but <strong>REMEMBER NOT TO MODIFY ITS PHP FILES CUSTOMLY<\/strong>, instead, utilise hooks from your plugin, like shown in above examples.<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<div class=\"default-content-clss excerpt_1423 type_post \"><p>Remember short-link to MUST-HAVE WP plugins: puvox.software\/wordpress&nbsp; How to modify any existing WordPress site CORRECTLY! Almost in 99% cases I&#8217;ve met, WordPress website holders, who want to modify their chosen<a class=\"excerpt-read-more\" href=\"https:\/\/puvox.software\/blog\/the-only-correct-method-to-modify-csshtml-etc-of-wordpress-website\/\">(Continue Reading)<\/a><\/p>\n<\/div>","protected":false},"author":1,"featured_media":1425,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[17,14,8],"tags":[],"class_list":["post-1423","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-coding","category-plugin","category-wordpress"],"_links":{"self":[{"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/posts\/1423","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/comments?post=1423"}],"version-history":[{"count":0,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/posts\/1423\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/media\/1425"}],"wp:attachment":[{"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/media?parent=1423"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/categories?post=1423"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/puvox.software\/blog\/wp-json\/wp\/v2\/tags?post=1423"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}