replace text in html with links from xml files
by jmishal from LinuxQuestions.org on (#4PXVW)
Hey all, I'm trying to write a bash script using some tools such as find & xargs and grep, sed etc I'll try to give as many details as possible
I have a lots of html files where I need to replace multi text based on links inside xml files and It seems that the image ID is that it will serve as a reference which will depend on them
I'll give an example
here one of my HTML files contain multi image id such as 6772.jpg , 6733.jpg , 6222.jpg
PHP Code:<html>
<div class="card" title="xxx1">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>1</strong>
<img class="thumb" src="https://example.com/video/6772.jpg" alt="learn">
<span class="session-title" >xx1</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx2">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>2</strong>
<img class="thumb" src="https://example.com/video/6733.jpg" alt="learn">
<span class="session-title" >xxx2</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx3">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>3</strong>
<img class="thumb" src="https://example.com/video/6222.jpg" alt="learn">
<span class="session-title" >xxx3</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">5 min</span>
</div>
</div>
</div>
</div>
</div>
</html>
where the "disable-lesson" need to replace with <a href="my link"> found it in the xml file
and the img id 6772.jpg , 6733.jpg , 6222.jpg is matching and found in xml files
and here the 5510084.xml, 5510900.xml , 4490300.xml files example
5510084.xml
Code:<?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>5510084</id>
<title>101 movie .mp4</title>
<description/>
<url>https://example.com/xxxx/5510084.html</url>
<thumbnail_small>https://example.com/video/6772.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>5510900.xml
Code:
<?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>5510900</id>
<title>401 movieR .mp4</title>
<description/>
<url>https://example.com/xxxx/5510900.html</url>
<thumbnail_small>https://example.com/video/6733.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>4490300.xml
Code: <?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>4490300</id>
<title>990 GoEnd .mp4</title>
<description/>
<url>https://example.com/xxxx/4490300.html</url>
<thumbnail_small>https://example.com/video/6222.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>
The final html files becomes like this
PHP Code: <html>
<div class="card" title="xxx1">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<a href="https://example.com/xxxx/5510084.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>1</strong>
<img class="thumb" src="https://example.com/video/6772.jpg" alt="learn">
<span class="session-title" >xx1</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx2">
<div class="card-header" role="tab" id="">
<a href="https://example.com/xxxx/5510900.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>2</strong>
<img class="thumb" src="https://example.com/video/6733.jpg" alt="learn">
<span class="session-title" >xxx2</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx3">
<div class="card-header" role="tab" id="">
<a href="https://example.com/xxxx/4490300.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>3</strong>
<img class="thumb" src="https://example.com/video/6222.jpg" alt="learn">
<span class="session-title" >xxx3</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">5 min</span>
</div>
</div>
</div>
</div>
</div>
</html>
.


I have a lots of html files where I need to replace multi text based on links inside xml files and It seems that the image ID is that it will serve as a reference which will depend on them
I'll give an example
here one of my HTML files contain multi image id such as 6772.jpg , 6733.jpg , 6222.jpg
PHP Code:<html>
<div class="card" title="xxx1">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>1</strong>
<img class="thumb" src="https://example.com/video/6772.jpg" alt="learn">
<span class="session-title" >xx1</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx2">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>2</strong>
<img class="thumb" src="https://example.com/video/6733.jpg" alt="learn">
<span class="session-title" >xxx2</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx3">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>3</strong>
<img class="thumb" src="https://example.com/video/6222.jpg" alt="learn">
<span class="session-title" >xxx3</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">5 min</span>
</div>
</div>
</div>
</div>
</div>
</html>
where the "disable-lesson" need to replace with <a href="my link"> found it in the xml file
and the img id 6772.jpg , 6733.jpg , 6222.jpg is matching and found in xml files
and here the 5510084.xml, 5510900.xml , 4490300.xml files example
5510084.xml
Code:<?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>5510084</id>
<title>101 movie .mp4</title>
<description/>
<url>https://example.com/xxxx/5510084.html</url>
<thumbnail_small>https://example.com/video/6772.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>5510900.xml
Code:
<?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>5510900</id>
<title>401 movieR .mp4</title>
<description/>
<url>https://example.com/xxxx/5510900.html</url>
<thumbnail_small>https://example.com/video/6733.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>4490300.xml
Code: <?xml version="1.0" encoding="UTF-8"?>
<videos>
<video>
<id>4490300</id>
<title>990 GoEnd .mp4</title>
<description/>
<url>https://example.com/xxxx/4490300.html</url>
<thumbnail_small>https://example.com/video/6222.jpg</thumbnail_small>
<duration>480</duration>
<width>1920</width>
<height>1080</height>
<tags/>
<embed_privacy>approved</embed_privacy>
</video>
</videos>
The final html files becomes like this
PHP Code: <html>
<div class="card" title="xxx1">
<div class="card-header" role="tab" id="">
<div class="disable-lesson">
<a href="https://example.com/xxxx/5510084.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>1</strong>
<img class="thumb" src="https://example.com/video/6772.jpg" alt="learn">
<span class="session-title" >xx1</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx2">
<div class="card-header" role="tab" id="">
<a href="https://example.com/xxxx/5510900.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>2</strong>
<img class="thumb" src="https://example.com/video/6733.jpg" alt="learn">
<span class="session-title" >xxx2</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">2 min</span>
</div>
</div>
</div>
</div>
</div>
<div class="card" title="xxx3">
<div class="card-header" role="tab" id="">
<a href="https://example.com/xxxx/4490300.html">
<div class="row">
<div class="col-9 text-left d-flex align-items-center">
<strong>3</strong>
<img class="thumb" src="https://example.com/video/6222.jpg" alt="learn">
<span class="session-title" >xxx3</span>
</div>
<div class="col-3 text-center text-md-right">
<img src="../app/images/clock.png" alt="clock">
<span class="text-bold-500 fz-13">5 min</span>
</div>
</div>
</div>
</div>
</div>
</html>
.