How to insert yours. How to Quickly Insert a Face into Another Photo in Photoshop

Every Internet user sooner or later faces a rather trivial task, but one that requires some necessary knowledge: how to post a file on the Internet so that other users can “download” it. Let's consider one of the ways to solve this problem: upload the file to a file hosting service.

You will need

• - Internet access
• - archiving program (WinRAR)

Instructions

First, let's prepare the file for sending. Before you get started, you'll need to make sure you have an archiving and file management program installed, such as WinRAR. We will consider archiving using this program as an example, but you can use any other program that is similar in functionality to WinRAR.

Open the folder in which the required file is located, select it and right-click to display the context menu. Here you need to select “Add to archive...” or “Winrar -> Add to archive...”. If there are several files, you will need them all before adding them to the archive.

In the dialog box that appears, come up with a name for the archive file (preferably in Latin letters, for example file.zip), the ZIP archive format (the most common) and, finally, the compression method (this determines the size of the final archive and its compression speed). It makes sense to compress files of uncompressed formats (for example tiff, bmp, wav, doc) as much as possible. Compressed formats (for example jpg, gif, mpg, mp3) will not take up less space when archiving, so in this case it is better to specify the “high-speed” compression method or the “no compression” method.

After we have specified the compression parameters and clicked on the OK button, the archiving process will begin. This process will take some time, after which a new archive will appear next to yours with the name specified in the previous step. This is what we will post on the Internet.

Next, you need to open your browser and go to the address http://rghost.ru. This is one of the file sharing services, we use it as an example for instructions. When you open the site, you will immediately see a form for adding a file. First, click the “Browse” button, find and select the archive we created, then confirm the selection with the “Open” button. To start downloading, you must click the “Submit” button.

Immediately after this, the process of uploading the file to the server will begin. You will be able to monitor the progress and speed of the download in real time, and the approximate completion time of the operation will be calculated for you.

Done, the file is posted on the Internet. You will see a personal page with information about your file. The “File Link” field contains the path where your archive will be available on the Internet. It is this link that you can copy and send to other Internet users.
Two more important fields are “Download Password” and “Retention Period”. In the first field, if necessary, you can set a password for downloading the file to make it difficult for unauthorized persons to access it. The second field is used to change the file storage period (from 1 to 30 days), after which the file is deleted automatically. After changing your password or term, be sure to click the “Update” button.

note

It should be kept in mind that each file hosting service has its own limitations on file size. Discussed in the article, rghost.ru allows you to download files of no more than 50 MB for free, ifolder.ru - up to 100 MB.
In addition, the speed of downloading and uploading files when using such servers is usually low, and it is recommended to be patient.

Helpful advice

Archiving files is highly recommended. This is done for the convenience of both the one who uploads the file to the Internet and the one who will need to receive this file. And if you need to post several files on the Internet at once, archiving them is simply necessary, because it is much easier to download and post one archive instead of a dozen different files or documents.

There are several ways how to insert a picture into another image in photoshop. In this article I will describe them all in great detail.

Preliminary preparation

First, you need to open the main image in Photoshop into which you want to insert another. This is very simple, even if there is a difficulty here, then how should it be done.

Then open the second image in the same way.

Thus, two images were opened in the program. They must be on different . The task is to transfer one of them to another. That is, in my example, I want to place the series logo next to the character’s portrait so that it looks like this:

Method number 1: dragging an image from a tab

Most often I use this method. It consists of simply dragging a picture from one tab to another.

By default, Photoshop shows a panel with tabs on one line:

We need to make sure that all the images are visible. To do this, pull the tab with the logo down:

• hover your mouse over the tab with the logo;
• press the left mouse button and, without releasing it, move the mouse down;

• You will see that the tab will take the form of a window, like a window in Windows OS, which means you can release the mouse button.

As a result, a window with another picture should appear on top of the main image, like this:

You can move this window to any location within the program. To do this, move the mouse cursor over the top part of the window containing the name of this picture and, while holding down the mouse button, move the window in any direction.

You can also feel free to resize this window if it is too big or small. To do this, hover your mouse over the lower right corner. When it takes the shape of a double-sided arrow, pull this corner to the side. The window will change according to the movement of your hand.

Now you need to connect the two images!

The picture did not appear at all in the size that we would like. It needs to be corrected. To do this, pull the ends of the black frame in the direction of decreasing or increasing. When finished, click on the check mark button located on .

To resize the picture proportionally, hold down the key Shift.

To bring up the editable frame again, click Ctrl+T.

Method number 4: dragging photos from the Windows OS folder

It would be logical to talk about this method after the first one, when you learned to drag a picture from a tab. By and large, the actions are similar, but the results are different. The result will be exactly the same as if you used "Place" command, that is, in the end we add a picture.

This method is suitable if the picture you need to insert is saved somewhere on your computer.

Open the folder with the image and position the window more conveniently.

After this, the image will be added as a smart object, that is, what I mean will be repeated.

If you notice an error in the text, select it and press Ctrl + Enter. Thank you!

I thought for a long time about what to call the article, but I couldn’t think of a better one. But now you will immediately understand what the point is. You have a website, you write articles on it and that’s great. But is something missing? The man came, read, and left, perhaps forever. And you really want him to return to your site more than once. Where do people return most often? That's right, to services!

But not everyone can create even a small service on their website, such as a link shortener; some experience is required. But what prevents us from showing someone else’s service on our website? Almost nothing! How to do it? This is where the title of the article is appropriate: how to insert a website into a website?

I won’t make a discovery for pros, but for beginners it will most likely be useful. Although, to be honest, I have never seen such an approach on any blog. But in vain, all these chips often give good results. A good example is my way of getting backlinks, . Result: 38512 links, all natural 😉

In this case, everything is solved by a banal iframe. Let me get straight to practice: I sometimes use a png image compression service. There are wonderful online services, you can use them without problems. But there is a minus here: you need to constantly keep all these services in mind or in bookmarks; you leave your site and use someone else’s. And so, if you insert a site into an iframe site, then you will use the service (and not only you) without leaving your site!

Today I have already created such a pseudo-service on a separate page for myself - (naturally, there is a good low-frequency query in the title, and in the explanatory text too)

How to make an iframe responsive?

Here is the method you can use in this case:

.video ( height: 0; position: relative; padding-bottom: 56.25%; ) .video iframe ( position: absolute; left: 0; top: 0; width: 100%; height: 100%; )

Didn't find the answer? Use the site search

We've released a new book, Social Media Content Marketing: How to Get Inside Your Followers' Heads and Make Them Fall in Love with Your Brand.

There are many tools that are ready to help you improve your website, increase the efficiency of your online business and improve interaction with customers. Many of these tools are free. But what if you're not a web developer and don't know how to install them on your site? This is a big obstacle.

As ironic as it may sound, a business that develops useful tools for your site also has an obstacle to its own prosperity - the need to force the installation of its code on users.

Let's try to solve two problems at once by talking about the most common ways to insert JavaScript code/snippets (fragments) for websites:

• On WordPress.
• Self-written admin accounts (using old-school FTP).
• On Squarespace.
• On Shopify.

At the end of the article we will touch on Wix. In most cases, this platform does not allow you to install JavaScript codes or snippets, but it does offer an alternative in the form of integrations for various services.

Where can I get the installation code?

Let's see where to look for the installation code using the Crazy Egg service as an example.

The process is standard: we enter registration data, after loading we get to the dashboard. There we look for the section with the code.

How to insert code into a WordPress site

You can use a special plugin – Tracking Code Manager.

To insert Tracking Code Manager, go to the site admin area and look for the plugins section in the control panel.

Select the “Add New” function.

A search bar will appear on the right. Enter “Tracking Code Manager”, then click “Install Now”.

After installation is complete, you need to make sure that the plugin is activated. Let's go to settings.

Click “Add new Tracking Code”.

You can do without the Tracking Code Manager plugin. In this case, our option is to paste the code into the header.php file of the WordPress theme (more on this later).

How to install code on WordPress.com site

A WordPress website and a WordPress.com website are two different things.

A WordPress website is a website that is managed using a CMS installed on its own server. This means that you paid for the domain name (myname.com) and for hosting.

WordPress.com is free. You can register a website on it without paying for hosting. In this case, the site URL will be: myname.wordpress.com. To change your domain name, you'll have to take a few extra steps.

When you run a site on WordPress.com, you are limited in the JavaScript codes and snippets you can install. The reason is security protocol - the developers do not allow users to paste codes into the platform. For example, the MySpace developers allowed it. This is obviously why the site dropped from 5th place in the world to 1967 in six years.

At the same time, WordPress.com offers users various bonuses for doing business. For example, integration with Google Analytics or the ability to add social media buttons. But in some cases this may not be enough.

How to install JavaScript codes and snippets on a self-written admin panel

Using FTP. We'll have to go back to the basics.

Nowadays many websites are self-written. A self-written website was created from scratch and does not use a CMS to manage content.

Let's imagine that we have just such a site. Putting code on it will be a little more difficult than on WordPress, because you will have to remember about FTP.

FTP managers like FileZilla allow you to drag and drop files and images from a website to a server. Using the program, you can add files to the server or download them, replace old files with new ones, delete unnecessary data, change dock names.

There is nothing complicated about the data transfer protocol: after just 20 minutes you can feel like a pro. For most people, the hardest part is simply contacting the server.

If you have any problems with the server, please contact your hosting provider. It may take an hour, but after 60 minutes you will know everything you need to know. I usually recommend recording these conversations using ScreenRecorder. Or at least make notes by hand.

After you have logged into the FTP server, be sure to do . If you make a mistake, your important files won't go anywhere. You can make a backup copy by simply dragging and dropping all files from the server to your computer.

Typically, the FTP manager software interface consists of two columns. For example, in the image below in the left column you can see files that are stored on the computer. On the right are files from the server.

To change or add files, simply drag them from one column to another.

Warning

Replacing files is dangerous. You can easily replace a new version of a file with an old one and lose more current data, accidentally delete something important, or make another mistake. A backup copy allows you to insure yourself in case of such mistakes and protect yourself from unnecessary problems. Be sure to save all files in a separate folder on your computer before making changes.

How to paste code using header.php

Let's say we have a website that we use WordPress to manage. To insert the code, we need to find the header.php file or another file called header or head.
Header needed to activate a JavaScript code or fragment on all pages of the site. You can use a free program like Sublime Text to open the file. With its help, you need to open a file that is stored on your computer, and not a similar file on the server.

When we open the file in Sublime Text, we see a rainbow of color code. Don't be afraid, everything is simple there.

All pages are divided into two sections – The head (headings) and the body (body). Headings are indicated by HTML code And. Body - And.

Most of the stuff that makes the site work and display text is located between these two sections. To find these tags, you can use the page search.
In most cases, you can insert the code right before the closing tag.

After you have inserted the code or snippet, save the file and upload it to the server. Ready.

Now about self-written admin panels. If your site was built by hand and you can't find the head or header file, you'll likely have to manually insert code into each page. Most often this does not cause much difficulty.

The image above is a hypothetical HTML site that consists of four HTML files. If we wanted to paste some code onto it, we would have to open all these files one by one and paste the code or snippet into the tags of each of them. After this, the process is standard: save the files and upload them to the server instead of the old ones.

How to Embed Code on Squarespace Website

Squarespace has made it easy for its users. To insert JavaScript code or snippet, you can use “code injection”. In the menu, go to the Settings > Advanced > Code Injection tabs. You can add code to or website footer.

Finding the settings.

Scroll down and click on “Advanced”.

Select "Code Injection".

Paste the code and save the changes.

How to embed code on Shopify

In the control panel, find the Online Store section and select Themes.

To access the desired tab, click on “Actions” and select “Edit HTML/CSS”.

We need fragments.

Clicking on the option will open a dialog box with the option to add a new fragment.

Give the snippet a name and click on the Create snippet button.

Enter the code for the snippet in the area for “tracking snippet.liquid”. Click "save".

How to insert a code if the site is on Wix

Wix has quickly become a popular website builder. Like WordPress.com, it places restrictions on its users' ability to paste codes.

But Wix offers a solution in the form of the Wix App Market. There you can find a variety of widgets for marketing, social media and analytics. By the way, you can also vote for the most needed widget there.

Hello, dear visitors!

In this article I will show you how to add a link to a website in the form of a simple hyperlink, an image, and also a button that you can set your own design using CSS styles. All 3 options are very often used and have a pretty good effect when used by visitors.

Let's start with the simplest and reach the complex.

Regular link and hyperlink

http://site/poleznoe/kak-sdelat-ssylku-na-sait.html

http: //site/poleznoe/kak-sdelat-ssylku-na-sait.html

This option has its place, but there is a significant drawback if we are talking about the effectiveness of such a link. It is not clickable, that is, you cannot go to it with a simple click of the mouse. This option is quite difficult for visitors to perceive.

Another thing is a hyperlink, which, when clicked, redirects to another document on the Internet, both internal (within the same site) and external (another site). An example of such a link can be seen below. Try clicking on the link.

The main page of my resource should open in a new tab. To implement this option, you must either use the tools of your engine, or write the following line in the HTML code.

Click here

The link is created with a simple tag , inside of which there is the address itself, where the user needs to be redirected, as well as a link anchor (in the example above, the anchor is the phrase “click here”), which indicates the link text explaining what you will receive when you go to this address.

If you have a simple website made in HTML, then you should write exactly this code in the page editor, changing my address to yours and specifying your anchor. It will look like this.

Inside a link tag There is also an attribute for opening the page in a new tab.

target = "_blank"

This is also very important, it is advisable not to throw the visitor out of the resource, but to leave him. Using this attribute, you will ensure that a visitor, by clicking on many links on one page, will not leave the current one, but at the same time will open many other pages. This is important if you are promoting a website.

You can add a title attribute to the link, which is a title tag and lets search engines know where the link leads. Also, this tag is displayed (if registered) when we point at a link in the form of a tooltip.

It is advisable to add a title tag so that visitors see this tooltip when hovering and understand where they are going. This is done simply, inside the opening tag , as in the example below.

When using an engine, such as WordPress, adding a link to a site is very simple without any edits in html mode. The post editor has a special icon with a connection icon.

In the image I showed the whole process of adding a connection between text and another page.

1. First, select the phrase that you want to make a link;
2. Click on the add connection icon;
3. We set the link parameters (the address of the page where you want to redirect the user, as well as the title of the link, that is, the anchor, if necessary).

You don’t have to enter the link title, as it will be the text that was selected at the first stage. In the image I showed adding links from existing site pages. You can do this, then when you click on one of the entries from the list, the URL and title will be entered automatically.

The URL can also be entered on an external site. If this is necessary, then enter the full (absolute) address of the page. To open a page in a new tab, there is no need to manually enter the attribute. The engine provides this option using one checkbox (see image above).

A little higher I said about the absolute address. This means that the full address of the page to which you need to redirect is written inside the link, regardless of whether it is our resource or another.

There is also a relative address, when it is not necessary to enter the full address. It is enough just to enter the path to some directory or page of the site, without specifying the domain name. Such links only work for pages within one resource. You can't refer to an external project like that.

If you want to dive deeper into the process of creating relative addresses, I highly recommend read this article on another resource. Everything is very coolly laid out there.

Link picture

Links in the form of images are also widely used, although they should be used only for their intended purpose. If we are simple links to other pages within our site, then it is better not to make them with pictures, since it is not always clear that you need to click on the image to get to some page.

It is advisable to do this when you want to advertise someone, for example, someone’s video course. In this case, you provide a regular hyperlink, followed immediately by an image link. In this case, it will be more clear that the image leads to the course website where it can be purchased.

If we take the html mode, then the principle of building the link structure is exactly the same, including all attributes. The only difference is the link anchor, which looks like the code for the image itself. In the previous case there was simple text.

In practice it will look like this.

As you can see, inside the opening and closing link tags there is an image code, which also has its own characteristics. You need to include the same title tag in it, indicate the path to the image on the hosting or on another resource. It is also worth specifying the image dimensions (width - width, height - height). And you should definitely include the alt attribute, which serves as a description of the image. If you write everything down, then image optimization will be up to par.

Here's what it looks like in html mode. I divided the code into 3 parts to make the link structure more understandable (clickable image).

The only difficulty here is to correctly enter the code of the image, which is used as an anchor.

Link button using CSS styles

If you want to do something differently, then this option also has a place to be. Moreover, it allows you to change styles so that when you hover over a button, both the button itself and the color of the inscription that will be inside it will change. If you take a picture, then it is not always possible to realize this. With styles, anything is possible.

Another very good advantage is that we can place the button strictly in the center and it will be clickable only in the area of ​​the button. If we take an image, then when we place it in the center, the entire width of the content area around the image will be clickable. Sometimes such a defect results in an accidental click on the image and, frankly, is annoying.

For example, I created a simple button that leads to the main page of the site. You can check its functionality.

If you look at the source code of the button, everything is very simple. The only difference from a regular hyperlink is the presence of an id, which is added inside the opening tag and in turn, design styles are written to it in the style.css file.

Here is the button structure itself.

We see that immediately after opening the link tag id="button" is specified, to which its own design styles are assigned. The rest of the structure is identical to the hyperlink.

The principle is clear, so I’m giving the styles that I added to this link button.

/* button styles in normal mode */ #button ( display: block; width: 550px; /* button width */ height: 60px; /* height */ background-color: #ff4343; /* background color */ text- shadow: 1px 1px #800909; /* text shadow */ color: #fff; /* text color */ border-style: solid; /* button border line type */ border-width: 1px; /* thickness button border (frame) line */ border-color: #db3a3a; /* button border (frame) line color */ font-size: 18px; /* text size */ line-height: 60px; /* linear text height * / font-weight: normal; /* text weight */ font-family: arial; /* font type */ text-align: center; /* text alignment */ text-decoration: none; /* text underlining */ margin : 40px auto; /* indent the button from other elements on the page */ text-transform: uppercase; /* so that all letters are capitalized. If not necessary, remove the line */ ) /* button styles when hovering the mouse cursor */ # button:hover ( background-color: #f23333; font-size: 19px; )