How to create such buttons with Wordpress? - wordpress

I'm very new to WordPress (tbh, it's my first time working with it). And I need to make a website as my school project using CMS. Creating pages with templates is alright, but I have a lot of troubles with buttons. I found this website, and I can see it using WordPress. I need such buttons as on this page https://movie-chooser.co.ua/random-movie-2/ (they appear when you hover over the image). Is this a default option for buttons in WordPress? If not, is there a plugin for this or what is the way to add them on my images?

First Install Elementor plugin https://wordpress.org/plugins/elementor/
and go to page when you add button and open page with elementor
and do drag and drop any element like button, space, text editor etc.

You have several ways to achieve that:
Overwritting Wordpress CSS
Using a plugin
Create your own shortcode
1 - Overwriting Wordpress CSS
If you manage to display all the elements using wordpress template, and your only issue is to display buttons over the images, then it should only be a matter of CSS
2 - Using a plugin
The idea here is to find a plugin that help you to create/display the informations you need (maybe you'll need to add functionnality to basic post though custom fields or using a custom post type).
Once you find the right plugin, again if the plugin dosen't directly offert some settings on the design then you'll have to overwrite the plugin's CSS rules to display the elements as you want.
3 - Create your own shortcode
If you're new to Wordpress I wouldn't recommend this method as it is kind of advanced, unless you're comfortable with PHP/HTML/CSS (optionaly JS).
This is the more flexible solution as you can basically control anything, but it will require you to understand some core concepts of Wordpress like WP Query and how custom queries works.
The idea here is to create a shortcode.
THis shortcode refere to a custom made PHP function, in which you can create a custom request to fetch the informations you need to display from Wordpress database, and display it in an HTML structure that you decide.
THen angain, you'll just have to customize it though CSS.
Note : no need to create a whole plugin if you decide to create a shortcode, you can use the template functions.php file for that.

Related

How to set HTML and CSS website on WordPress?

I have a Website that is designed on Html and Css. Now I want to make it same as on WordPress. Tell me the best possible options that help me to create same as its style. I also want to add that css on WordPress.
You have several options for that.
1- Create your custom theme. this will allow you to add your HTML and CSS codes.
2- you can use page builders like Elementor and use the HTML element. then by adding your HTML and CSS codes that will render on the page.
Using both above methods will not allow you to edit page as you normally do using page builders. it has to be using HTML and CSS.
3- Re-create your website using page builders on wordpress, it will be easy and fast and you can make future edits easier.
Navigate to your Admin Dashboard.
You can use the WordPress Visual Editor to quickly add HTML files to
your website.
Click Pages in the left sidebar. Next, look at the left-hand
sidebar.
Choose an existing page or create a new one.
Click Add Block.
Add a 'File' block.
Choose your HTML file.

How to have single-slug behave like a normal page in WordPress?

I'm making a website in WordPress, and I'm using a plugin ACF PRO. I'm doing the entire site with flexible content, so the WordPress site is like a page builder.
Everything is fine, however, I came to a point where I need to have same functionality for single-[custom-post-type], so I can "Add row", header, footer etc... on it, but I can't figure out on how to do it.
I know that it's possible, because e.g if you look at this site here: https://rolleragency.co.uk/our-projects/
You can see that it works. I know they are using flexible content because I worked on that site and I did there what I wanted. I can't remember how to do that.
I think I had to use a Tempate Page? Or? I can't remember.
THe site is built entirely on flexible content, so everything there is modular and it's like a drag and drop, but how do I do that on single-slug?
You have to create a page template, yes.
So something like page-projects.php then in WordPress admin you would have a page called Projects.
The template you created should be automatically applied to this page. If it doesn't for some reason you can choose which template WP should use on the right side when editing a page.
Now, you can add whatever code you need to the page-projects.php. And also any fields you may need for that page you can set up in ACF by telling ACF to apply those fields to pages that use projects template.
This is how I would and did do it on several occasions :)

Wordpress Customizer image gallery

I am trying to add in an option in the admin panel that let's a user populate an image gallery that I've created.
Looking through the Customizer API, I see how to add options, but it's still not what I want.
Is it better to build a plugin? Any reference that's recommended?
There are multiple carousels you could use. As far as I know, there should be a plugin but not many. I reccommend using Bootstrap's carousel, though

Wordpress TinyMCE not converting simple 'www.sitename.com' to hyperlink, as in demos

Despite the behavior of examples shown on TinyMCE's demo pages (http://www.tinymce.com/tryit/classic.php), I am unable to get TinyMCE on my Wordpress 4.0 site to act in such a way that if you simply type "www.sitename.com" into the editor and press space, it's automatically converted into a hyperlink for http://www.sitename.com/.
To be clear, it doesn't convert into any link at all...This isn't a case of absolute vs. relative links. That's what most of the talk seems to be about when it comes to TinyMCE and link creation. ...Would that I could get to that stage!
I can find no toggle or option or plugin name to enable automatic link creation, and yet it's there in their demos on the TinyMCE's site.
Can anyone tell me how I might get this feature up and running, ideally by not adding another Wordpress plugin?
Err...That being said, I'm open to a suggestion if you have a really good one! :)
Cheers!
Even though you found a plugin, some background might help because I personally think this is a good question:
Wordpress uses TinyMCE, however the Wordpress WYSIWYG Editor is actually heavily extended and no longer fully resembles the original TinyMCE editor you see on the TinyMCE website.
In order for links to automatically render in TinyMCE, the 'autolink' plugin needs to be enabled. The following native TinyMCE plugins are used by Wordpress:
charmap
colorpicker
hr
lists
media
paste
tabfocus
textcolor
fullscreen
image
In addition to these, Wordpress also employs the following custom plugins to fill out the remainder of the functionality you normally see:
wordpress
wpautoresize
wpeditimage
wpgallery
wplink
wpdialogs
wpview
It is my belief that Wordpress left out this behavior by design. As you know, the Autolink plugin specifically converts all valid URLs to comparable anchor tags once the space or return keys are pressed. However, Wordpress does allow you to explicitly convert URLs or words to anchor tags using its own plugin 'wplink'.
It should be noted that the wplink plugin closely resembles the native anchor plugin, but is NOT the same.
With the ability to both explicitly define your links in both the visual editor (via the wplink plugin) and the Text (aka: HTML) editor, I believe the development team decided to forgo on automatically linking content in favor of allowing authors to explicitly provide links where needed.
With all of that said:
Wordpress does provide a convenient way of adding new TinyMCE plugins via its 'mce_external_plugins' filter. If you would like to add the autolink functionality without the use of an external plugin, you may download the latest TinyMCE package, upload the autolink plugin (tinymce/js/tinymce/plugins/autolink) to your theme folder, and then add the following to your theme's functions.php:
add_filter('mce_external_plugins', 'mm_add_tinymce_plugins');
function mm_add_tinymce_plugins($plugins){
$plugins['autolink'] = get_stylesheet_directory_uri().'/path/to/tinymce/plugins/autolink/plugin.js';
return $plugins;
}

Wordpress - hardcoding subscribe2 (or any other plugin) widget into template

I know how to hardcode categories, archives, etc into theme but for one of my projects i would have to hardcode some plugins widgets (especially subscribe2) and i'm not sure how to do this. I know i can add widgets via widgets menu in wp admin, but that's not what i'm trying to achieve, i'm trying to set it up permamently in theme for later reuse. How to do this? Especially with subscribe2?
You can add the widget via the normal means, and check the code on the site using View->Source.
Then, you need to edit the html template for the theme (depending on where you want the widget to appear - main entry, sidebar.html, etc) and add the code there directly.

Resources